解決代碼加載慢，以至於亂碼—————VUE

vue.js解決開始代碼加載，以至於亂碼

vue.js通過幾行代碼可以解決這個問題

css:

[v-cloak] {
			display: none;
		}

html:

<div id="app" v-cloak></div>

使用後會等vue加載完再呈現效果，就不會出現，代碼在視圖裏了。

順帶介紹幾個基礎的vue api。

綁定css樣式：

css：

.done {
			text-decoration: line-through;
			color: #ccc;
		}

html:

<span v-bind:class="{done:item.done}">
    {{item.title}}</span>

v-bind:class="{done樣式:這是樣式中的：這是item中的某一些進行篩選，item.done是true的那些選擇} "

點擊事件：

v-on:click=“這裏寫個事件”

@click=“”和上面的一樣

const app = new Vue({
				el: '#app',
				data: {
					todos,
					todoText: ''
				},
				methods: {
					handleAddTodoClick() {
                        xxxxx
                    }
}

綁定按鍵：

<input type="text" value="" v-model='todoText' @keydown.enter="handleAddTodoClick" />

這是綁定回車。

後面有機會再寫點別的。