vue中属性绑定和双向绑定

1、属性绑定html

<div id="root">
        <div v-bind:title=" 'dear jin,' + title">hello world</div>
    </div>

    <script>
        new Vue({
            el: "#root",
            data: {
                title: 'this is hello world'
            },
            methods: {

            }
        })
    </script>

经过 v-bind:title = " " 实现title绑定,等号 后面" " 里面可用js的表达式。vue

v-bind:title 可缩写成 :title。this

2、双向绑定双向绑定

<div id="root">
        <input type="text" v-model="content" />
        <div>{{content}}</div>
    </div>

    <script>
        new Vue({
            el: "#root",
            data: {
                content: "this is content"
            },
            methods: {

            }
        })
    </script>

v-model 为vue模板数据双向绑定指令。code