慕九州5109875
2019-08-05 17:49
代码想实现点击事件发生的内容切换,在点击事件里面利用Vue实例的sign_c作为标示,但是不知道是语法错误还是怎么样?切换效果没有发生!请教是哪里错
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue里面的数据、方法、事件</title>
<script type="text/javascript" src="vue.js"></script>
</head>
<body>
<!-- @click和v-on:click 一样-->
<div id="root">
<div v-text="msg" @click="changeMsg"></div>
<div v-html="content" v-on:click="changeContent"></div>
</div>
<script type="text/javascript">
new Vue({
el:"#root",
data:{
content:"<h1>Hello World</h1>",
msg:"<h1>Hello World</h1>",
sign_c:0,
sign_m:0
},
methods:{
changeContent:function(){
if(sign_c==0){
this.content="<h1>Hello SuperAnt</h1>"
sign_c=1
}
else{
this.content="<h1>Hello World</h1>"
sign_c=0
}
},
changeMsg:function(){
this.msg="<h1>Hello SuperAnt</h1>"
}
}
})
</script>
</body>
</html>
sign_c=true,如果只有两种状态,用布尔值更好,!变量名->直接取反
changeContent: function() {
if (this.sign_c == 0) {
this.content = "<h1>Hello SuperAnt</h1>"
this.sign_c = 1
} else {
this.content = "<h1>Hello World</h1>"
this.sign_c = 0
}
}
你的sign_c应该是this.sign_c,data里的数据是需要用this来引用的
你的sign_c 的值不是手动添加的所以不会变 说了获取到值你要加 this.sign_c才能获取到你data里的值不然一直是0 怎么变???
在 sign_c 前面加上 this.
changeContent: function() {
if(this.sign_c == 0) {
this.content = "<h1>Hello SuperAnt</h1>"
this.sign_c = 1
} else {
this.content = "<h1>Hello World</h1>"
this.sign_c = 0
}
}
vue2.5入门
146824 学习 · 657 问题
相似问题