亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

vue里的data要用return返回的原因淺析

 更新時(shí)間：2019年05月28日 17:12:22   作者：枝麻醬  
這篇文章主要介紹了vue里的data要用return返回的原因淺析,需要的朋友可以參考下

官網(wǎng)的示例

var vm = new Vue({
 el: '#example',
 data: {
 message: 'Hello'
 }
});

項(xiàng)目中的寫法

data() {
 return {
 message: 'Hello'
 }
 }

為什么要把data變成函數(shù)并return屬性呢？

組件是一個(gè)可復(fù)用的實(shí)例，當(dāng)你引用一個(gè)組件的時(shí)候，組件里的data是一個(gè)普通的對(duì)象，所有用到這個(gè)組件的都引用的同一個(gè)data，就會(huì)造成數(shù)據(jù)污染。

將data封裝成函數(shù)后，在實(shí)例化組件的時(shí)候，我們只是調(diào)用了data函數(shù)生成的數(shù)據(jù)副本，避免了數(shù)據(jù)污染。

PS：下面看下vue中data是否使用return的區(qū)別

// Vue實(shí)例中data屬性是如下方式展示的：
let app = newVue({
  el: "#app",
  data: { msg: '' },
  methods: {}
})
// 使用組件化的項(xiàng)目中是如下方式展示的:
export default{
  data(){
    return{
      showLogin:true,
      msg:''
    }
  },
  methods:{}
}

// 為何在大型項(xiàng)目中data需要使用return返回?cái)?shù)據(jù)呢？
// 答：不使用return包裹的數(shù)據(jù)會(huì)在項(xiàng)目的全局可見，會(huì)造成變量污染
//    使用return包裹后數(shù)據(jù)中變量只在當(dāng)前組件中生效，不會(huì)影響其他組件

總結(jié)

以上所述是小編給大家介紹的vue里的data要用return返回的原因淺析，希望對(duì)大家有所幫助，如果大家有任何疑問請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！

相關(guān)文章

最新評(píng)論