vue.js如何实现点击显示或隐藏效果?

https://img2.mukewang.com/5bf7a20500012d6504110261.jpg

如图,点击红色部分,下面蓝色部分会显示或者隐藏。然后用户可以自行添加类似的模块,请问如何写?

交互式爱情
浏览 4935回答 1
1回答

狐的传说

刚学 vue,我做个练习:<div id="app-5">&nbsp; &nbsp; <button v-on:click="func1">点击按钮</button>&nbsp; &nbsp; <b>{{seenmsg}}</b>&nbsp; &nbsp; <p v-if="seen">11111111111111111</p></div><script type="text/javascript">var app5 = new Vue({&nbsp; el: '#app-5',&nbsp; data: {&nbsp; &nbsp; seen: true,&nbsp; &nbsp; seenmsg: ''&nbsp; },&nbsp; methods: {&nbsp; &nbsp; func1: function () {&nbsp; &nbsp; &nbsp; &nbsp; this.seen=!this.seen;&nbsp; &nbsp; &nbsp; &nbsp; if(this.seen==true){this.seenmsg='段落已被显示';}&nbsp; &nbsp; &nbsp; &nbsp; if(this.seen==false){this.seenmsg='段落已被隐藏';}&nbsp; &nbsp; }&nbsp; }})</script>
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript