編集:ソリューションがmapStateToPropsに別の変数を接続していました。Redux - 同一のレデューサー、コンテナ、およびコンポーネントが異なる結果を生成しています
私はreact-reduxアプリケーションにいくつか問題があります。私は何が間違っているのか分かりません。
ソースコードはfound hereです。
アクションとレデューサーが正常に動作しているように見えますが、Duplicate
ロジックとは異なり、アルファベット順のボタンが切り替わっても用語集は再レンダリングされません。私はこれを店舗に正しく引っ張っていないので、これは推測しています。
私はDuplicate
レデューサ、アクション、コンテナ、コンポーネントを作成しました。これらのコードを実行したら、Alphabetical
ファイルにコードをコピーしました。変数名の他に、コードは同じでなければなりませんが、それぞれのレデューサーを個別にcreateStoreで実行すると、duplicates
は正しく動作し、alphabetical
は正しく動作しません。
ボタンは、createStore関数でtoggleDuplicates
を使用すると表示されます(私はまだ減速機を組み合わせている理由がわかりません - 多分これは問題に関係していますか?)。 toggleDuplicates
または
let store = createStore(
allReducers,
initialState,
compose(
applyMiddleware(createLogger())
)
);
toggleAlphabetical
へ
srcが/ entry.jsx
変更allReducersはnpm run server
意図した動作があり、npm install
を実行し、ディレクトリに、CDを実行するにはDuplicate
およびAlphabetize
ボタンは、トグル時にGlossaryTableを正しい値で更新します。 visibleWords
状態が更新されたときGlossaryTable
はtoggleDuplicates/toggleAlphabeticalの減速によって返された後(再レンダリングする必要があります。
のsrc /コンテナ/ GlossaryContainer.js私は私が正しく配線されないかもしれないと思う
これは、派遣への状態まで。
const mapStateToProps = (state) => ({
visibleWords: getVisibleEntries(
state.words,
state.visibleWords,
state.toggleDuplicates,
state.toggleAlphabetical
)
});
const VisibleGlossary = connect(
mapStateToProps
)(GlossaryTable);
export default VisibleGlossary;
店舗を作成するときはinitialStateを避けてください。 – Hosar