数据绑定

数据绑定使用 Mustache 语法（同时支持双大括号、单大括号）将变量或表达式包起来，可以用于绑定文本内容或元素属性。

绑定文本

绑定文本使用 Mustache 语法，变量需要在data中定义。

<template>
    <text>{{msg}}</text>
</template>
<script>
    export default {
        name: 'test',
        data(){
            return {
                msg: 'hello'
            }
        }
    }
</script>

大括号里面的内容也可以为表达式时，如：

<text>{{'message: ' + this.data.msg}}</text>

绑定属性

绑定属性可以使用 Mustache 语法，也可以使用v-bind指令。

使用 Mustache 语法：

<text text={{msg}}></text>

使用v-bind指令：

<text v-bind:text="msg"></text>

计算属性

数据绑定的变量也可以是计算属性，如：

<template>
    <text v-bind:text="message"></text>
</template>
<script>
    export default {
        name: 'test',
        data(){
            return {
                msg: 'hello'
            }
        },
        computed:{
            message:function(){
                return 'message:' + this.data.msg;
            }
        }
    }
</script>