[解決済み] Vuexで他のゲッターからゲッターを呼び出すにはどうすればよいですか?
2022-04-29 01:40:48
質問
シンプルなVueのブログを考えてみましょう。
データストアとしてVuexを使用しており、2つのデータストアをセットアップする必要があります。
ゲッター
: a
getPost
を取得するためのゲッターです。
post
をIDで、また
listFeaturedPosts
は、各特集記事の最初の数文字を返します。注目の投稿リストのデータストアスキーマは、投稿をそのIDで参照しています。これらの ID は、抜粋を表示するために実際の投稿に解決される必要があります。
ストア/ステート.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',
]
}
ストア/ゲッターズ.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);
}
ストア/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
})
ドキュメントによると
getters
パラメータを使用して、他のゲッターにアクセスすることができます。しかし、私が
getters
の内部から
listFeaturedPosts
のために、コンソールにエラーが表示されます。
getters.getPost
は、そのコンテキストでは未定義です。
を呼び出すにはどうすればよいのでしょうか?
getPost
の内部からVuexゲッターとして
listFeaturedPosts
というのは、上記の例では?
どのように解決するのですか?
VueJS 2.0では、このような場合に限って
state
と
getters
.
ゲッターは他のゲッターに 第2引数 :
export default foo = (state, getters) => {
return getters.yourGetter
}
公式のドキュメントです。 https://vuex.vuejs.org/guide/getters.html#property-style-access
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン