zoukankan      html  css  js  c++  java
  • 09.v-if指令

    <body>
        <div id="app">
            <button @click="toggleIsShow">切换显示状态</button>
            <p v-if="isShow">我是一个段落 v-if</p>
            <p v-show="isShow">我是一个段落 v-show</p>
            <h2 v-if="temperature >30">热死啦</h2>
        </div>
    
        <script src="https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.js"></script>
        <script>
            // v-if 和 v-show都是根据真假切换元素  不同的是
            // v-if 是直接操作DOM树 对性能消耗比较大  如果频繁操作的元素用 v-show  反之用 v-if
    
            var app = new Vue({
                el: '#app',
                data: {
                    isShow: true,
                    temperature: 40
                },
                methods: {
                    toggleIsShow: function() {
                        this.isShow = !this.isShow;
                    }
    
                }
            })
        </script>
    </body>
  • 相关阅读:
    四月⑨日
    4月⑦日
    4月6日
    四月⑧日
    第一天上课
    modelsim的do文件
    SCCB协议
    FPGA之VGA控制
    FPGA常用术语
    乘法器之六(硬件乘法器)
  • 原文地址:https://www.cnblogs.com/yanglaxue/p/14203804.html
Copyright © 2011-2022 走看看