为什么不能显示{{myGame}},结果最初应该是超级马力欧,并且在用户按下按钮时会更改它,但是没有显示,只是显示{{myGame}}。我不知道如何解决它,谢谢!
let myApp = new vue({
el:'myApp',
data:{
myGame:'超級馬力歐'
},
methods:{
btnClick: function(pname){
this.myGame = pname;
},
},
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<div id="myApp" >
<p> 您最喜歡的遊戲是:{{myGame}}</p>
<button v-on:click="btnClick('我的世界')">我的世界</button>
<button v-on:click="btnClick('我的世界33')">我的世界33</button>
<button v-on:click="btnClick('我的世界44')">我的世界44</button>
<button @click="btnClick('我的世11界')">我的世11界</button>
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>
</div>
</body>
</html>
最佳答案
这是适合您的固定脚本。作为一般建议,将来尝试阅读控制台,从而找出错误的根源。问题在于您引用的不是您应有的方式,其次您以错误的方式引用了app元素
let myApp = new Vue({
el:'#myApp',
data:{
myGame:'超級馬力歐'
},
methods:{
btnClick: function(pname){
this.myGame = pname;
},
},
});
<div id="myApp" >
<p> 您最喜歡的遊戲是:{{myGame}}</p>
<button v-on:click="btnClick('我的世界')">我的世界</button>
<button v-on:click="btnClick('我的世界33')">我的世界33</button>
<button v-on:click="btnClick('我的世界44')">我的世界44</button>
<button @click="btnClick('我的世11界')">我的世11界</button>
</div>
<script src="https://unpkg.com/[email protected]/dist/vue.js"></script>