vue 2.0 드 롭 다운 상자 기본 제목 설정 방법

어제 부터 지금까지 vue 2.0 으로 성별 선택 상 자 를 쓰 고 있 습 니 다.option 에 seled 속성 을 추가 하 자마자 잘못 보 고 했 습 니 다.


다음은 잘못된 코드 입 니 다.

ERROR in ./~/vue-loader/lib/template-compiler.js?id=data-v-c231dfa2!./~/vue-loader/lib/selector.js?type=template&index=0!./src/components/second.vue
template syntax error <select v-model="selected">:
inline selected attributes on <option> will be ignored when using v-model. Declare initial values in the component's data option instead.

selected 는에 연결 되 어 있 습 니 다.어떤 옵션 을 선 택 했 습 니까?selected 는 그 옵션 의 value 입 니 다.어떤 옵션 을 기본 으로 선택 하고 싶 으 면 data 의 selected 에서 그 옵션 의 value 로 설정 하 십시오.
를 누 르 면'성별'이라는 옵션 에 disabled 속성 을 추가 하면 사용 하지 않 을 수 있 습 니 다.

<template>
 <select v-model='selected' @click="ss()">
 <option v-for="(option,index) in options" v-bind:value="option.value" :disabled="option.disabled">
 {{ option.text }}{{index}}{{option.disabled}}
 </option>
 </select>
 <span>Selected: {{ selected }}</span>
</template>
<script>
 export default{
 name: 'second',
 data(){
 return {
 selected: 'sex', //            ，      value    'sex'
 options: [
 {text: '  ', value: 'sex', disabled: ''}, //             selected  
 {text: ' ', value: '1'},
 {text: ' ', value: '2'}
 ]
 }
 },
 methods: {
 ss: function () {
 this.options[0].disabled = disabled;
 },
 }
 }
</script>

이상 의 vue 2.0 드 롭 다운 상자 의 기본 제목 설정 방법 은 바로 작은 편집 이 여러분 에 게 공유 하 는 모든 내용 입 니 다.여러분 께 참고 가 되 고 저 희 를 많이 사랑 해 주 셨 으 면 좋 겠 습 니 다.