一、数据

    <div id="root">
        {{msg}}
    </div>

两个花括号的语法，叫做插值表达式。
还可以写成v-text或v-html，v-text或v-html是vue的一个指令。
区别：v-html不会被转义，v-text会被转义。

使用v-text显示hello：

<body>
    <div id="root">
        <div v-text="content">
        </div>
    </div>
    <script>
        new Vue(
            {
                el: "#root",    //挂载点就是上面id = root的标签
                data: {
                    content: "<h1>hello</h1>"
                }
            }
        )
    </script>
</body>

换成v-html之后效果如下：

二、事件和方法

v-on模板指令可以绑定事件
方法写在methods
this.content可以修改data中的content
语法糖 @ 相当于 v-on

<body>
    <div id="root">
        <div @click="funcClick">
            <div v-text="content"></div>
        </div>
    </div>
    <script>
        new Vue(
            {
                el: "#root",
                data: {
                    content: "hello"
                },
                methods:{
                    funcClick: function(){
                        this.content = "world"
                    }
                }
            }
        )
    </script>
</body>