2015-11-06 11 views
7

seguito Vue.js 1.0 examples, ho fatto un menu a discesa selezionare con il progetto V-modello, in questo modo:Vue.js 1.0 metodo non sta lavorando al cambiamento selezionare

{{ project }} 
<select class="projects" v-model="project" @change="changeProject"> 
    <option value="1">School</option> 
    <option value="2">Personal</option> 
    <option value="3">Work</option> 
</select> 

Il js bit:

new Vue({ 
    el: '#main', 
    data: { 
     project: '' 
    }, 
    methods: { 
     changeProject: function(){ 
      console.log(this.project); 
     } 
    } 
}); 

Il tag {{ project }} viene visualizzato correttamente, ma quando si seleziona un altro valore sul menu a discesa Seleziona non viene attivato il metodo changeProject.

Cosa mi manca qui?

Cheers.

EDIT:

Dopo @ di mustafo risposta, ho cercato di creare un semplice pulsante con un metodo @Fare clic e stampare il valore. Solo @change su questa selezione non funziona.

EDIT2:

ho capito perché questo non sta funzionando. Sto cambiando l'opzione selezionata di questa casella di selezione con una funzione jquery, perché avevo bisogno di creare un menu a discesa in css completo, e quindi ho creato una "maschera" per questo.

+2

ma si sta lavorando. [jsfiddle] (http://jsfiddle.net/nnbr214c/) –

+1

strano ... il mio non lo è. Sebbene un semplice clic su un pulsante funzioni. – rafamds

risposta

7

Beh, ho incontrato questo problema pure. La soluzione corretta secondo me è aggiungere v-model per selezionare tag e quindi aggiungere osservazione di quel modello in watch oggetto:

watch: { 
    myModel: function(currentValue) { 

     // do my stuff 
    } 
} 
2

Sembra che la tua versione di vue.js non supporti stenografie. Prova v-on:change="..." invece di @change="..."

+3

grazie per la tua risposta @mustafo. Ho provato in quel modo, ma non funziona ancora – rafamds

Problemi correlati