Vueの知識ノート1

図1に示すように、基本的なコード構造のVueの定義：vue.jsを導入する工程と、スクリプトが定義されたオブジェクトのVueするvar VM =新しいヴュー（{EL '#ID'）} とDOM IDを記載の結合要素。
2、補間式の「V-テキスト」との違いを使用します。

    <p>{{ msg }}可以添加字符</p>
    <p v-text="msg">此处字符会被替换</p>
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                msg: 'hello'
            }
        })
    </script>

3、V-マントの修正は、発現前補間表示データを点滅：[V-マント] {表示：なし;}
。4、V-HTML HTML形式の描画データ（比較Vテキスト、内部DOMをカバーするすべての要素であります値が、HTMLは、HTML形式のデータを解析し、レンダリングすることができる、V-テキスト）は、プレーンテキスト出力に変換する
5、V結合バインドプロパティ：DOMの属性名の前に追加する「V-バインド：」または「：」（略称結腸）の属性値は、後に対応するデータの値に置き換えることができます。

    <input type="button" v-bind:value="msg" v-on:click="show"/>
    <!-- 按钮值为"hello" 点击提示"world" -->
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                msg: 'hello'
            },
            methods: {
                show: function () {
                    alert('world');
                }
            }
        })
    </script>

6は、V-上のイベントのバインディング：「V-上の」追加name属性のDOMや「@」（略称）の前に、対応するメソッドの関数として、後のイベントを交換することができます。

ます。https：//www.jianshu.com/p/73efba6e3232で再現