<abbr id="ckaok"></abbr>

vue里的數據

sugarmo 發布于2019-08-23 12:34 / 2931人閱讀

摘要：本文主題里數據的處理存放數據我們先看里哪里能存放數據單個文件里。官方插件，作為一個集中管理經常復用的數據很有用。數據傳遞數據傳遞也分幾種情況全局傳遞。數據的修改有以下幾個別去修改，本身就是基于依賴，但是是個很好的展示數據容器。

背景：

一個項目完工在即，鑒于此，前端使用了vue，寫下此欄，以供日后翻閱，
會涉及到我所運用到的vue相關知識，需要一定的js基礎。
默認vue的single-file-components（單文件組件開發）既sfc。

本文主題

vue里數據的處理 存放數據

我們先看vue里哪里能存放數據：

1.單個vue文件里。
2.官方插件vuex，作為一個集中管理經常復用的數據很有用。
3.直接聲明在vue實例上,用$號標識。

第一種情況下存放數據對于單個文件又分這幾種屬性
1.1 data(常規使用，默認函數返回:忘記為啥了)
1.2 computed(計算，也就說，這是一個基于其他屬性的屬性)
1.3 watch(監聽屬性，官方推薦在此分類下的屬性用于觸發異步函數)
1.4 props(特殊，用來接收父組件向子組件傳遞的屬性)
1.5 propsData(特殊，貌似是用來測試的)

第二種情況下數據存放都在state里
第三種情況是特別特別特別的，不討論(都有vux，還用什么$號啊)。

數據傳遞

數據傳遞也分幾種情況
1.全局傳遞。
2.父向子傳遞。
3.子向父傳遞。

第一種情況，請使用vuex,注意刷新會清空
第二種情況，子聲明props，父在子組件上聲明這個屬性，就能傳遞下去
第三種情況，一般情況就用事件提交，父監聽子聲明的事件，然后就能接收到了

這里對props和事件做個特殊說明，假如運用了第三方的vue框架，你可能就是封裝一下
對方的組件使其變成專用的子組件，這個時候，方法啊，屬性啊，都在第三方組件上
而你封裝的木有。如果一個個在去聲明，第三方組件的props或者event著實累，自然有
簡便的api啦。vm.$attrs,vm.$listener,然后你封裝的子組件就把所有事件和屬性都會被
第三方的組件所監聽。vm.$listener，除法你開發了特殊的指令，否則，不用官網那樣聲明，第三方聲明的事件都會被監聽。

數據的修改

有以下幾個note：
1.computed

別去修改，本身就是基于依賴，但是computed是個很好的展示數據容器。它原本是只有get方法，但是可以聲明set方法。

2.watch

有兩個屬性，deep和immediate，一個是深度檢測，一個是立即執行，相當于任務隊列的第一個觸發，deep不如直接用"foo.bar"的形式來監視.

如果同時監視N個屬性，而這幾個屬性又都有關聯性，個人推薦，這個時候，不要用watch，不如去監聽事件，用switch語句更加方便，尤其是在有異步方法存在的時候，異步隊列搞得心都碎了。

3.props

最好有默認值

4.比較簡單便捷的方式，是引用某個組件,參開api里的ref。

云服務器 GPU云服務器 html里的常用數據 js里的數據格式 js獲取里的數據 java里的數據結構

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/98758.html

酷狗音樂- Vue / React 全家桶的兩種實現

摘要：引言兩個月前用全家桶實現過一次酷狗音樂，最近又用全家桶重構了下，最終成果和的實現基本一致，放個圖手機預覽戳版本版本。的行為結構表現分離，很明顯，而的分離雖然不是很明顯，但實際上也是有的。發送指令，最終會到里合并數據，與中的類似。引言兩個月前用 Vue 全家桶實現過一次酷狗音樂，最近又用 React 全家桶重構了下，最終成果和 Vue的實現基本一致，放個圖： showImg(htt...

hot_pot_Leo 2019-08-23 14:57 評論0 收藏0
【干貨】vue源代碼簡單解析

摘要：解析器的狀態機設計首先要說文件夾里有各種財寶等著大家挖掘認真看一看一定不會后悔的主要的職責是可以把一個數據里的某一個路徑下的數據取出來，比如所以對字符串的解析成為了它的關鍵。最近饒有興致的又把最新版 Vue.js 的源碼學習了一下，覺得真心不錯，個人覺得 Vue.js 的代碼非常之優雅而且精辟，作者本身可能無 (bu) 意 (xie) 提及這些。那么，就讓我來吧：）程序結構梳理 s...

ccj659 2019-08-21 11:55 評論0 收藏0
Vue.js 源碼學習筆記

摘要：實際上，我在看代碼的過程中順手提交了這個，作者眼明手快，當天就進行了修復，現在最新的代碼里已經不是這個樣子了而且狀態機標識由字符串換成了數字常量，解析更準確的同時執行效率也會更高。最近饒有興致的又把最新版?Vue.js?的源碼學習了一下，覺得真心不錯，個人覺得 Vue.js 的代碼非常之優雅而且精辟，作者本身可能無 (bu) 意 (xie) 提及這些。那么，就讓我來吧：）程序結構梳...

darkbaby123 2019-08-23 13:44 評論0 收藏0
Vue.js 源碼學習筆記

摘要：實際上，我在看代碼的過程中順手提交了這個，作者眼明手快，當天就進行了修復，現在最新的代碼里已經不是這個樣子了而且狀態機標識由字符串換成了數字常量，解析更準確的同時執行效率也會更高。最近饒有興致的又把最新版?Vue.js?的源碼學習了一下，覺得真心不錯，個人覺得 Vue.js 的代碼非常之優雅而且精辟，作者本身可能無 (bu) 意 (xie) 提及這些。那么，就讓我來吧：）程序結構梳...

jsdt 2019-07-25 14:34 評論0 收藏0