Vue.jsが遅いクライアントに角括弧を表示しないようにします

Question

私はちょうど私の最初のVue.jsアプリを作ったと素晴らしいです。私が持っていた唯一の問題は、低速接続で値をバインドすることに関連しています。

は例えば、私のtemplateに私はこのコードを持っている：

<div v-for="event in events"> 
    <div class="start_time"> 
     {{ event.start_time_formatted }} 
    </div> 
    <div class="icon_placeholder"> 
     <img v-bind:src="event.icon" alt="Sport Image" /> 
    </div> 
    <div class="event_title"> 
     <a v-bind:href="event.url"> 
      {{ event.title }} 
     </a> 
    </div> 
    <div class="button_placeholder"> 
     <a v-bind:href="event.url" class="btn btn-filled"> 
      Watch 
     </a> 
    </div> 
</div> 

をしかし、問題は、すべて私のサイトの資産がロードされるまで、私はこの結果を得ることである：例えば

、AngularJSの例では、ディレクティブを使用して値をバインドし、大括弧が表示されないようにすることができます。

Vue.jsでこの効果をどのように達成できますか？

Answer 1

v-textは、より多くの角度を描画できるようにする必要があります。v-cloakは、ひげそりタグが必要な状況での編集が終了するまで、テンプレートの内容を非表示にすることができます。