Vuetify V-Select-Element ändert nicht den Wert

Question

EDIT Ich verwende Vuetify's v-select nicht vue-select component.

Wenn ich die Auswahl mache passiert nichts. Startwert einstellen funktioniert.

Vorlage:

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

Skriptdaten:

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

Ich habe in den Quellcode geschaut und ich, dass selectItem ausgelöst werden nicht Generatorleitung 128 die in v-select herausgefunden (0.14.8 Version, siehe Code unten)

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

ich habe versucht, die Modernisierung und Module Herabstufung, aber ich denke, das Es ist irgendwo eine Art "dummer" Fehler. Vielen Dank für jede Art von Input :)

Meine Abhängigkeiten in package.json:

"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

AKTUALISIERT
Das Problem könnte sein, dass Sie die neueste Version von Vue nicht haben (die neueste Vuetify benötigt 2.4.1). Das ist es, was ich beim Zusammenfügen dieses Ausschnitts erfahren habe. Dies funktioniert wie erwartet.

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>