Vue（4）- 指令【v-html，v-bind】

v-html指令：{{ }} 会将数据解释为普通文本。为了输出真正的 HTML，需要使用 v-html 指令

<div id="app">
    <p>Using mustaches: {{ html }}</p>
    <p v-html="html"></p>
</div>
<script type="text/javascript">
    var vm = new Vue({
        el : "#app",
        data : {
            html : '<span style="color:red">this is should be red</span>'
        }
    });
</script>

v-bind指令：为html标签绑定属性，该属性的实际值是data里面对应的变量的值

<div id="app">
    <div v-bind:class="color">content</div>
    <div v-bind:title="tips">content</div>
</div>
<script type="text/javascript">
    var vm = new Vue({
        el : "#app",
        data : {
            color:'blue',
            tips:'提示'
        }
    });
</script>
<style type="text/css">
    .blue{color:blue;}
</style>