v-once 和 v-html 、 v-text 的理解

通过v-once指令，只进行一次性的插值，当数据改变时，插值的内容不会改变。

<div id="app">
        <button @click="change">点击</button>
        <div v-once>{{message}}</div>
    </div>
    <script>
        let vm = new Vue({
            el:'#app',
            data:{
                message:'h'
            },
            methods: {
                change(){
                    this.message = 'j'
                }
            },
        })
    </script>

点击值并不会改变

<div v-text="message"></div>

　<div v-text="msg"></div>

<div v-html="msg"></div>

<script>
        let vm = new Vue({
            el:'#app',
            data:{
                message:'hong',
                msg : "<h1>这是一个h1元素内容</h1>",
                contentHtml:'<span style="color:red">红</span>'
            },
            methods: {
                change(){
                    this.message = 'jing'
                }
            },
        })
    </script>