美文网首页
v-show指令,控制元素的显示和隐藏

v-show指令,控制元素的显示和隐藏

作者: greenPLUS | 来源:发表于2018-09-13 14:49 被阅读0次
<body>
<div id="itany">
    <button v-on:click="age">显示</button>
    <h1 v-show="alt">{{msg}}</h1>
</div>
<script src="dist/vue.js"></script>
<script>
    new Vue({
        el:'#itany',
        data:{
            msg:'img/1.jpg',
            alt:true//这个跟上边想要隐藏的内容有关
        },
        methods:{
//判断alt要是false的话就隐藏,true的话就显示
            age:function(){
                if(this.alt) {
                    this.alt=false
                }else {
                    this.alt=true
                }
                /*this.alt=!this.alt*/
            }
        }
    })
</script>
</body>

相关文章

  • 2018-09-11 vue第二章

    v-show 控制元素的显示或隐藏 v-show 是用display:none 控制 v-show也是条件渲染指令...

  • 2018-09-11

    v-show/v-if 控制元素显示或隐藏 v-show 是用display:none;来控制元素显示或隐藏的 ...

  • 2018-09-11 vue控制元素

    v-show/v-if控制元素显示或隐藏 v-show 是用display:none;来控制元素显示或隐藏的 v-...

  • Vue指令之v-show

    Vue指令之v-show v-show 指令根据表达式的真假来显示元素和隐藏,是响应式的v-show 指令通过改变...

  • vue v-show v-bind v-if v-

    1. v-show和v-if都可以控制元素的显示或隐藏 v-show 例: 例:点击显示和隐藏 2.v-bind ...

  • 基本指令02

    v-show v-show 指令通过改变元素的 css 属性(display)来决定元素是显示还是隐藏,根据表达式...

  • vue.js----v-show

    v-show:控制元素的显示和隐藏,使用display:none来隐藏 例: html部分 js部分

  • v-if,v-show与v-for指令

    v-if:控制DOM存在与否的判断指令,操作时直接将元素标签从DOM中移除和新建,达到显示隐藏的效果v-show:...

  • v-show指令,控制元素的显示和隐藏

  • v-show v-if v-bind 和display

    一、v-show和v-if:v-show和v-if都可以控制元素的显示或隐藏,但是v-show是用display控...

网友评论

      本文标题:v-show指令,控制元素的显示和隐藏

      本文链接:https://www.haomeiwen.com/subject/etmwgftx.html