javascript – Der Wert von Daten in Vue kann nicht geändert werden

Question

Der Namenswert und der Langwert der Warnung beim Erstellen sind beide korrekt. Warum ist der Wert des Namens beim Auswählen undefiniert? Die beim Erstellen geänderten Lang- und Kurzwerte sind wahr, aber auf der Seite sind sie immer noch falsch

            <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>
            

Egal welchen Wert der übergebene Name hat, die langen und kurzen Werte auf der Seite sind falsch

 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;
              
           }
        },


    }

Answer 1

你这代码看着逻辑很混乱，点击事件里面有页面跳转。that还没有看见你定义，this.shop也没见到，一步步认真检查下。