您好,登錄后才能下訂單哦!
這篇文章主要為大家展示了“vue里的data為什么要用return返回”,內容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“vue里的data為什么要用return返回”這篇文章吧。
官網的示例
var vm = new Vue({ el: '#example', data: { message: 'Hello' } });
項目中的寫法
data() { return { message: 'Hello' } }
為什么要把data變成函數并return屬性呢?
組件是一個可復用的實例,當你引用一個組件的時候,組件里的data是一個普通的對象,所有用到這個組件的都引用的同一個data,就會造成數據污染。
將data封裝成函數后,在實例化組件的時候,我們只是調用了data函數生成的數據副本,避免了數據污染。
PS:下面看下vue中data是否使用return的區別
// Vue實例中data屬性是如下方式展示的: let app = newVue({ el: "#app", data: { msg: '' }, methods: {} }) // 使用組件化的項目中是如下方式展示的: export default{ data(){ return{ showLogin:true, msg:'' } }, methods:{} }
// 為何在大型項目中data需要使用return返回數據呢?
// 答:不使用return包裹的數據會在項目的全局可見,會造成變量污染
// 使用return包裹后數據中變量只在當前組件中生效,不會影響其他組件
以上是“vue里的data為什么要用return返回”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注億速云行業資訊頻道!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。