VUE data传值
生活随笔
收集整理的這篇文章主要介紹了
VUE data传值
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
data 必須是一個函數
上面例子中,可以看到 button-counter 組件中的 data 不是一個對象,而是一個函數:
data: function () {return {count: 0} }這樣的好處就是每個實例可以維護一份被返回對象的獨立的拷貝,如果 data 是一個對象則會影響到其他實例,如下所示:
<!DOCTYPE html> <html><head><meta charset="UTF-8"><title>v-on-data事件</title><script src="js/vue.js"></script></head><body><div id="components-demo"><button-counter></button-counter><button-counter></button-counter><button-counter></button-counter></div><script>var buttonCounter2Data={count:0}Vue.component('button-counter',{data:function(){//data選項是一個對象,會影響到其他實例;return buttonCounter2Data},template:'<button v-on:click="count++">點擊了{{count}}次</button>'})new Vue({el:'#components-demo'})</script></body> </html>?
?
創作挑戰賽新人創作獎勵來咯,堅持創作打卡瓜分現金大獎總結
以上是生活随笔為你收集整理的VUE data传值的全部內容,希望文章能夠幫你解決所遇到的問題。