基本語法格式：

<script>

new Vue({

? el: '#app',

? data: {

??? url: 'http://www.runoob.com'

? }

})

</script>

?

指令 【指令是帶有 v- 前綴的特殊屬性。】

?????? 判斷? <p v-if="seen">現在你看到我了</p>

?????? 參數? <a v-bind:href="url">菜鳥教程</a>

?????? 監聽? v-on 指令，它用于監聽 DOM 事件： <a v-on:click="doSomething">

　　過濾器：{{ message | capitalize }}?? 或?? <div v-bind:id="rawId | formatId"></div>

　　　　例：

　　　　

?

?????? 雙向數據綁定? v-model用在表單控件上的，用于實現雙向數據綁定，所以如果你用在除了表單控件以外的標簽是沒有任何效果的。

?

===========================

計算屬性：computed

computed vs methods

我們可以使用 methods 來替代 computed，效果上兩個都是一樣的，但是 computed 是基于它的依賴緩存，只有相關依賴發生改變時才會重新取值。而使用 methods ，在重新渲染的時候，函數總會重新調用執行。

?

=====================

Vue.js 樣式綁定

v-bind:class? 設置一個對象

?

===========================

Vue.js 事件處理器

事件監聽可以使用 v-on 指令：

?

====================

Vue.js 組件

prop 是單向綁定的：當父組件的屬性變化時，將傳導給子組件，但是不會反過來。

?

//js

Vue.component('todo-item', {

? props: ['todo'],

? template: '<li>{{ todo }}</li>'

})

?

new Vue({

? el: '#app',

? data: {

??? todo :""

? }

})

?

?

?

不理解的問題：

?

轉載于:https://www.cnblogs.com/liuyuweb/p/8525016.html

總結

以上是生活随笔為你收集整理的学习vue.js的自我梳理笔记的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。