vue 구성 요소의 드롭 다운에서 선택된 값을 얻으려면 어떻게해야합니까?

Question

내 VUE 구성 요소, 당신은

Vue template syntax error:

: inline selected attributes on will be ignored when using v-model. Declare initial values in the component's data option instead.

내가 그것을 어떻게 해결할 수있는 오류가 존재 꿀꺽에

<template> 
    <div> 
     ... 
     <select class="form-control" v-model="selected" @change="myFunction()"> 
      <option selected disabled>Status</option> 
      <option v-for="status in orderStatus" v-bind:value="status.id">{{ status.name }}</option> 
     </select> 
     ... 
    </div> 
</template> 

<script> 
    export default { 
     data() { 
      return{ 
       selected: '' 
      } 
     }, 
     methods: { 
      myFunction: function() { 
       console.log(this.selected) 
      } 
     } 
    } 
</script> 

아래이 볼 수 있습니까?

Answer 1

이

<option selected disabled>Status</option> 

https://vuejs.org/v2/guide/forms.html#Select

v-model will ignore the initial value, checked or selected attributes found on any form elements. It will always treat the Vue instance data as the source of truth. You should declare the initial value on the JavaScript side, inside the data option of your component.