使用v-if案例

发布于 2022年 05月 19日 13:12

使用v-if案例

需求：点击三次触发事件；弹出及Dom元素

        <!DOCTYPE html>
        <html>
            <head>
                <meta charset="utf-8">
                <title></title>
                <script src="js/vue.min.js"></script>
            </head>
            <body>
                <div id="app">
                    <!-- 判断条件 v-if ="boo == 23"-->
                    <p v-if ="boo == 23">Dom元素</p>
					<!--触发事件 "add"方法 -->
                    <button @click ="add">触发事件</button>
                </div>
                <script>
                    new Vue({
                        <!--挂载点  -->
                        el:'#app',
                        <!--初始数据  -->
                        data:{
                            boo:20
                        },
                        methods:{
                            add(){
                                <!--调用触发事件的方法，使判断条件++  -->
                                this.boo++;
                            }
                        },
                    })
                </script>

            </body>
        </html>

推荐文章