Stellen Sie sich ein einfaches Vue-Blog vor: Ich verwende Vuex als Datenspeicher und muss zwei Getter einrichten : einen getPost
Getter zum Abrufen einer post
ID sowie einen Getter listFeaturedPosts
, der die ersten Zeichen jedes vorgestellten Beitrags zurückgibt. Das Datenspeicherschema für die Liste der empfohlenen Beiträge verweist auf die Beiträge anhand ihrer IDs. Diese IDs müssen zum Anzeigen der Auszüge in tatsächliche Beiträge aufgelöst werden.
store / state.js
export const state = {
featuredPosts: [2, 0],
posts: [
'Lorem et ipsum dolor sit amet',
'Lorem et ipsum dolor sit amet',
'Lorem et ipsum dolor sit amet',
'Lorem et ipsum dolor sit amet',
'Lorem et ipsum dolor sit amet',
]
}
store / getters.js
export default getPost = (state) => (postID) => {
return state.posts[postID]
}
export default listFeaturedPosts = (state, getters) => () => {
console.log(getters) // {}
return state.featuredPosts.map(postID => getters.getPost(postID).substring(0, EXCERPT_LENGTH);
}
store / index.js
import Vue from 'vue'
import Vuex from 'vuex'
import state from './state'
import * as getters from './getters'
import * as mutations from './mutations'
Vue.use(Vuex)
export default new Vuex.Store({
state,
getters,
mutations
})
Gemäß der Dokumentation kann der getters
Parameter verwendet werden, um auf andere Getter zuzugreifen. Wenn ich jedoch versuche, getters
von innen darauf zuzugreifen listFeaturedPosts
, ist es leer und es wird ein Fehler in der Konsole angezeigt, da getters.getPost
er in diesem Kontext nicht definiert ist.
Wie rufe ich im obigen Beispiel getPost
von innen als Vuex-Getter auf listFeaturedPosts
?
Ich habe ohne getestet
state
und nicht funktioniert. Deshalbstate
ist es notwendig.das funktioniert:
das hat nicht funktioniert
quelle
state
Objektgetters
und ignorieren das zweite Argument, das das eigentlichegetters
Objekt wäre. Wenn Siegetters
in diesem Beispiel nach innen schauen würden, würden Sie sehen, dass es sich tatsächlich um Ihr Statusobjekt handelt.Getter erhalten andere Getter als 2. Argument
Hier ist ein Link zu den offiziellen Dokumenten - https://vuex.vuejs.org/guide/getters.html#property-style-access
quelle
Anstatt den Status zu übergeben , übergeben Sie Getter und rufen Sie dann einen anderen Getter an, den Sie möchten. Ich hoffe es hilft.
In Ihrem Geschäft / getters.js
quelle
export default foo = ({ getters }) => { return getters.anyGetterYouWant }