2017-09-30 18 views
0

私はvueの文書に従っています。そして私は、セットアップの次のコードをvueを使い始める - データが表示されません

 <div class="row" style="margin-top:15px;"> 
     <div class="col-md-12"> 
      <div id="app"> 
       <ol> 
        <li v-for="todo in todos"> 
         {{ todo.text }} 
        </li> 
       </ol> 
      </div> 
     </div> 
    </div> 
    <script type="text/javascript" src="{{ constant('JS_URL') }}lib/vue.js"></script> 
    <script> 
     new Vue({ 
      el: '#app', 
      data: { 
       todos: [ 
        { text: 'Learn JavaScript' }, 
        { text: 'Learn Vue' }, 
        { text: 'Build something awesome' } 
       ] 
      } 
     }); 
    </script> 

私の出力は次のようになりますしている:

<div id="app"> 
<ol> 
<li></li> 
<li></li> 
<li></li> 
</ol> 
</div> 

私はこれを理解しません。 3回ループしていますが、データが表示されません。ドキュメントの他の例はすべて同じ結果を示します。私はなぜこれが起こっているのか知らない。

他のライブラリもjqueryのようにページに含まれていますが、私のコンソールにはエラーは表示されません。開発モードで実行しているvueメッセージのみが表示されます。

また、メッセージを表示しているページの最初の例はうまくいきません...何が間違っていますか? (最新バージョンを使用してIM)

+1

はああ...私はエラーを発見しました。私はtwig(phpテンプレートエンジン)と組み合わせて、{{......... – rZaaaa

答えて

0

のPHP WICHはまた、使用のために、私は小枝テンプレートエンジンを使用して、{{}}表記は私はこのようにVUEの区切りを変更:

  var app2 = new Vue({ 
      delimiters: ['${', '}'], 
関連する問題