Vue08 - 内蔵指示

V-マント

説明：V-マントは通常、CSSの表示を、削除バウンドからコンパイルVueのインスタンスの終わりに表現、html要素を必要としません：なし;使用と。スマンは、それがロードされていないVueのワードを発生した場合、「{{XXX}}」あなたはVUEのインスタンスを作成するまで、DOMが交換されるので、画面はまた、あなたがCSSコードを追加する必要があり、点滅します。 [V-マント]：{ディスプレイ：重要どれも;}の組み合わせで使用されないが、WebPACKのVUEルータ及び工学プロジェクトで使用することができ、プロジェクトVUE空のdivの構成のみ、残りの内容はマウントへのルートが完了すると、V-マントは、単純なプロジェクトにのみ適用され、使用する必要はありません

<！DOCTYPE HTML > 
< HTML > 
< ヘッド> 
    < タイトル>のVue ---内置指令</ タイトル> 
    < スクリプトタイプ= "テキスト/ javascriptの" SRC = "https://unpkg.com/vue/dist/vue.min。 JS」> </ スクリプト> 
    < スタイルタイプ= "テキスト/ cssの" > 
        [V-マント]：{ 
            ディスプレイ：！どれも重要。
        } 
    </ スタイル> 
</ ヘッド> 
<
    DIV ID = "アプリケーション" V-マント> 
        {{メッセージ}} 
    </ DIV > 
    < スクリプトタイプ= "テキスト/ javascriptの" > 
        のvar アプリ=  新しいヴュー（{ 
            EL：' #app ' 、
            データ：{ 
                メッセージ：' 这是一段话' 
            } 
        }）
    </ スクリプト> 
</ ボディ> 
</ HTML >

 Vワンス

説明：命令は、発現を必要とするその役割は、唯一の要素またはコンポーネントのすべての子ノードを含む要素または成分、一旦レンダリングされ定義されていません。第1の描画後、データの変更を再レンダリングしないと、メッセージが原因でデータが発生したページに変更が変更されない変更、静的コンテンツとして扱われます。

<！DOCTYPE HTML > 
< HTML > 
< ヘッド> 
    < タイトル>のVue ---内置指令</ タイトル> 
    < スクリプトタイプ= "テキスト/ javascriptの" SRC = "https://unpkg.com/vue/dist/vue.min。 JS」> </ スクリプト> 
</ ヘッド> 
< ボディ> 
    < DIV ID = "アプリケーション"  > 
        < スパンVワンス> {{メッセージ}} </ スパン> 
        <
            スパン> {{メッセージ}} </ スパン> 
        </ DIV > 
    </ DIV > 
    < スクリプトタイプ= "テキスト/ javascriptの" > 
        VARのアプリ=  新しいヴュー（{ 
            EL：' #app ' 、
            データ：{ 
                メッセージ：' 这是一段话' 
            } 
        }）
    </ スクリプト> 
</ ボディ> 
</ HTML >