javascript - The value of data in vue cannot be changed
The name value and long value of my alert in created are correct, why is the value of name in choose undefined, and the long and short values changed in created are true, but they are still false on the page
<li v-bind:class={active:long} @click='chose'>
<router-link to='/long'>第一页{{long}}</router-link>
</li>
<li v-bind:class={active:short}>
<router-link to='/short'>第二页{{short}}</router-link>
</li>
No matter what the value of the passed name is, the long and short in the page are false
import Vue from 'vue';
export default {
props: ['name'],
data() {
return {
long:false,
short:false,
}
},
methods:{
chose(){
console.log(this.name);//这里输出undefined
console.log(this.short);
}
},
created(){
var name=this.name;
console.log(name);//这里值是正确的
switch (name){
case "long":
this.long=true;
alert(that.long+"long");//当name值为long时弹出true
break;
case "short":
alert(name);
this.short=true;
break;
}
},
}
