Vuetify v-selectアイテムが値を変更しない

Question

EDIT私はVuetify's v-selectではなくvue-select componentを使用しています。

選択を行うと何も起こりません。初期値の設定は機能します。

テンプレート：

<v-select 
    :items="accountTypes" 
    v-model="formData.AccountName"> 
</v-select> 

スクリプトデータ：

accountTypes: [ 
    {value: 1, text: "student"}, 
    {value: 2, text: "company"} 
], 
formData: { 
    FirstName: '', 
    LastName: '', 
    Email: '', 
    AccountTypeId: 1, 
    AccountName: 1, 
    UserName: '', 
    Password: '' 
}, 

私はソースコードに見てきたと私はSelectItem関数は、V-選択の発電線128（でトリガを取得しないことが分かりましたバージョン0.14.8、以下のコードを参照してください）

const data = { 
    on: { click: e => this.selectItem(item) }, 
    props: { 
     avatar: item === Object(item) && 'avatar' in item, 
     ripple: true, 
     value: active 
    } 
    } 

モジュールのアップグレードとダウングレードを試みましたが、 reはどこかの "ばかげた"間違いのようなものです。入力:) package.jsonで

私の依存関係のいずれかの種類をありがとう：UPDATED

"dependencies": { 
    "axios": "^0.16.2", 
    "express": "^4.15.4", 
    "js-cookie": "^2.1.4", 
    "nuxt": "^0.10.7", 
    "vue": "^2.4.2", 
    "vue-server-renderer": "^2.4.2", 
    "vue-template-compiler": "^2.4.2", 
    "vuetify": "^0.14.8" 
    }, 
    "devDependencies": { 
    "cross-env": "^5.0.5", 
    "stylus": "^0.54.5", 
    "stylus-loader": "^3.0.1" 
    } 
} 

Answer 1

問題は、あなたが（最新のVueの非常に最新のバージョンを持っていないことが考えられますVuetifyには2.4.1が必要です）。それが私がこのスニペットをまとめる際に遭遇したものです。これは期待どおりに動作します。

new Vue({ 
 
    el: '#app', 
 
    data: { 
 
    accountTypes: [{ 
 
     value: 1, 
 
     text: "student" 
 
    }, { 
 
     value: 2, 
 
     text: "company" 
 
    }], 
 
    formData: { 
 
     FirstName: '', 
 
     LastName: '', 
 
     Email: '', 
 
     AccountTypeId: 1, 
 
     AccountName: 1, 
 
     UserName: '', 
 
     Password: '' 
 
    } 
 
    }, 
 
})

form { 
 
    width: 50%; 
 
}

<link href="https://unpkg.com/vuetify/dist/vuetify.min.css" rel="stylesheet" /> 
 
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script> 
 
<script src="https://unpkg.com/vuetify/dist/vuetify.js"></script> 
 
<v-app id="app"> 
 
    <form> 
 
    <v-select :items="accountTypes" v-model="formData.AccountName" label="Select" single-line bottom> 
 
    </v-select> 
 
    {{formData.AccountName}} 
 
    </form> 
 
</v-app>