vue---模板语法

一次性插入,不再修改:v-once

    <body>
        <div id="app">
            <h1>{{message}}</h1>
            <h1 v-once>v-once:{{message}}</h1>
            <button type="button" @click="changetext">改变文字</button>
        </div>
        <script type="text/javascript">
            var app=new    Vue({
                el:"#app",
                data:{
                    message:"hello Vue"
                },
                methods:{
                    changetext:function(){
                        this.$data.message="hello world"
                    }
                }
            })
        </script>
    </body>

 插入html标签:v-html

    <body>
        <div id="app">
            <!-- 不会读取标签,全部以文本形式展示 -->
            <h1>{{htmlTxt}}</h1>
            <!-- 以html标签形式被读取 -->
            <h1 v-html="htmlTxt"></h1>
        </div>
        <script type="text/javascript">
            var app=new    Vue({
                el:"#app",
                data:{
                    htmlTxt:'<span>hello</span>'
                }
                
            })
        </script>
    </body>

猜你喜欢

转载自www.cnblogs.com/by-young/p/12906960.html