Vue.js で簡単な ToDoList の事前準備を実装

1. はじめに

私は最近、軽量の mvvm フレームワーク Vue.js を学び始めました。中国語のドキュメントに関する限り、非常に完全です。以前はバージョン1.0を勉強していたのですが、ある日ふと公式サイトを開いたら2.0にアップデートされていました。その後、それ以降はすべて 2.0 構文に変更されました。 ps: Vue の初心者の場合は、学習の参考として使用できるビデオが MOOC にあります (ここでは、ToDoList を作成して学習プロセスを記録した小さなおもちゃを参照しただけです)。

2. オープニング
最近、フロントエンドで注目されているのが mvvm フレームワークです。Lagou に行って調べてみると、基本的にその 70% には要件があります。ということは嘘ではなく、お金を増やすためには時代についていくべきですよね？ブログ投稿「http://www.cnblogs.com/xueduanyang/p/3601471.html」をお勧めします。これは非常に詳細であり、弁証法的に見る必要があると思います。

ナンセンスはこれくらいにして、本文に入りましょう

/************************************************* *************/

この Todolist で必要な Vue.js ポイントの合計は次のとおりです:

1 Vue インスタンスを作成します: 例:

var vm= new Vue();

2. リストのレンダリング: 例:

v-for="(item,index) in todo_items"; 3. バインディング イベント: 例:

2.1 Vueインスタンスの作成

<div id="app">{{ message }}</div>

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

vm = new Vue({
el : 'test',
data : {
msg : ' app.$data.message '
}
})

   
<div v-for="item in items">
  
 {{ item.text }}
  
 </div>

例:

これらの 3 つのポイントで、この簡単な ToDoList を書き始めることができます。