Vue學習記錄

new Vue({html

      el:"#id",    //綁定元素web

      data:{        // 數據this

      },spa

      methods:{   //方法集htm

      }事件

});input

一、針對標籤內容  直接 {{  lab  }}  ,若是須要調用方法  {{ function() }}it

二、針對屬性能夠用,屬性綁定:  v-bind:href="website"  注意此處沒有 {{  }}雙括號io

三、針對標籤, v-html="websiteTag" 此處也沒有雙   {{  }}注意此處沒有 {{  }}雙括號event

四、針對事件,v-on:click="age++"   針對簡單的已存在的數值屬性,能夠直接使用表達式,age++,  age-- ;    可是複雜的方法就須要從新定義了  並使用 v-on:click="function"。 這裏的function能夠帶括號也能夠不帶括號,可是若是有參數就必需要帶括號和參數了。v-on: 能夠變成 @

 五、事件修飾符  stop(阻止事件冒泡)    once(一次)    prevent(阻止默認事件) 等等不一一列舉。鍵值修飾符:例如 tab  enter  等等不一一列舉  特殊狀況:雙按鍵  例如 alt+enter   v-on:click.alt.enter   單按alt無論用,單用enter也不行,一塊兒按才執行。

六、雙向數據綁定(輸入輸出綁定):必定是跟input、  select、  textarea等等有關,換句話說必定是跟輸入有關。    這裏介紹一個新的語法  ref="attribute"  ,咱們在input裏使用<input ref="name" />     this.$refs.name.value  ,另外一種方式 v-model="name"

相關文章
相關標籤/搜索