v-textディレクティブ

v-textディレクティブを使う場面

・マスタッシュタグを使用せずに、ディレクティブを使用したいときにv-textディレクティブを使用します。

例(上のpタグはマスタッシュタグ、下がv-textで表示)

index.html

<div id="app">
    <p>
        {{message}}
    </p>
    <p v-text="message">

    </p>

</div>

index.js

var app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue.js!!'
    }
})

ブラウザ

gyazo.com

マスタッシュタグとv-textの使い分け

・テキストの一部のみ置き換えたい場合にはマスタッシュタグにする必要があります。(v-textディレクティブでは配下のテキストを丸ごと置き換えてしまいます。)