Vue.js隨筆四(方法的聲明和使用)
阿新 • • 發佈：2019-03-09
font 裏的 多說 就會 點擊 col eth ima 是的
1.首先你需要新建路由，這個就不多說了
2.然後在你的新的.vue裏面需要如下所示的添加methods：{方法}，然後按鈕的裏面你會看到v-on:click，這就是點擊這個按鈕會觸發的動作，這個就是觸發methods裏的highlight函數，當然v-on:click也可以寫成@click這兩個是一樣的
1 <html> 2 <head> 3 <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script> 4 </head> 5<body> 6 <div id=‘app‘> 7 {{ message }} 8 <br/> 9 <button v-on:click=‘highlight‘ style=‘margin-top: 50px‘>真的嗎</button> 10 </div> 11 12 <script> 13 var app = new Vue({ 14 el: ‘#app‘, 15 data: {16 message: ‘學習Vuejs使我快樂~ ‘ 17 }, 18 methods: { 19 highlight: function() { 20 this.message = this.message + ‘是的， 工資還會漲~!‘ 21 } 22 } 23 24 }) 25 </script> 26 </body> 27</html>
3.最關心的結果來了，點擊真的嘛按鈕後就會變成圖2哦
Vue.js隨筆四(方法的聲明和使用)