鍍金池/ 問答/Java  HTML/ vue工程,有一個(gè)數(shù)組是axios后臺(tái)得到的,多個(gè)組件都需要使用,應(yīng)該如何存儲(chǔ)這

vue工程,有一個(gè)數(shù)組是axios后臺(tái)得到的,多個(gè)組件都需要使用,應(yīng)該如何存儲(chǔ)這個(gè)數(shù)組?

最好的解決辦法就是用vuex了嗎?為什么不能直接將store里面的值在data里面賦值,而必須在computed里面呢?

我每個(gè)組件都要用就每個(gè)組件都要有computed來接收這些store里面的數(shù)組。

有人能提供一個(gè)例子嗎,謝謝

回答
編輯回答
貓小柒
  1. vuex 就是為了解決各個(gè)組件之間使用 公共數(shù)據(jù)打造的;
  2. 放 computed 里是為了可以響應(yīng)變化,你也可以放在 data里;
    但是官方不支持:
    圖片描述
2017年9月9日 20:41
編輯回答
安淺陌

vuex 了解一下

2018年8月22日 21:07
編輯回答
掛念你

vuex不就是用來干這個(gè)的嗎

2017年8月5日 01:48
編輯回答
撿肥皂

你不能直接存到localStorage里?

2017年8月2日 12:02
編輯回答
久礙你

用vuet的mapRules完美解決這問題,作者開發(fā)這個(gè)就是為了飚車。

<template>
<div class="txt-left txt-b-info">你正在編輯:{{menuEdit.form.name}}</div>
</template>
import {mapModules, mapRules} from 'vuet'

export default {
    mapModules({
      menuEdit: 'sys-menu-edit',
      moduleNames: 'sys-module-names',
      menuNames: 'sys-menu-names',
      aclList: 'sys-acl-list'
    }),
    mapRules({need: 'sys-module-names', temp: 'sys-menu-edit', route: 'sys-acl-list'})
    
   // ...
}
    
2018年9月7日 22:21
編輯回答
涼薄

這個(gè)其實(shí)也要看場(chǎng)景的。

如果你后臺(tái)取回來這個(gè)數(shù)組就不會(huì)變化了,相當(dāng)于是個(gè)靜態(tài)常量。
比如: ALL_ROLES = ['student', 'teacher']這樣,那你完全可以存在localStorage里,要用的時(shí)候再去取,去之前沒有的話就去服務(wù)器fetch一下,也是很ok的,唯一的缺點(diǎn)可能就是同步的I/O速度慢那么一點(diǎn)點(diǎn)點(diǎn)。

如果你這個(gè)數(shù)組是隨時(shí)變化的,而且?guī)讉€(gè)數(shù)組依賴的都是一個(gè)“活”的“單例”數(shù)據(jù),那最好的肯定就是放在store里啦。寫起來也灰常簡(jiǎn)單,依賴這個(gè)數(shù)組的組件每次created的時(shí)候dispatch一下fetch data的action,然后mapGetters映射到組件computed里就好了,偽代碼:

// ExComponent.vue
import {mapGetters} from 'vuex'
created () {
    this.$store.dispatch('fetchArrData')
},
computed: {...mapGetters(['arr'])}

相當(dāng)簡(jiǎn)潔,又爽,你不可能再找出更優(yōu)雅的方式啦

2017年11月20日 23:07