楽なアイテム
6611 ワード
シンプルなレンタルアイテム
任意のフォルダを作成し、jsファイルを作成します.
そしてこのフォルダにnpm init -y
コマンドを使用してプロジェクトを作成します.npm install redux
コマンドを使用してRedux関連node moduleをインストールします.
reduceライブラリを読み込んだ後
まずRidexの中央ストレージを作成します.
次にreduce関数を作成します.
redux reduce関数
Reduserにはいくつかの条件が必要です.
まず純真さを授与しなければならない。
この関数では、同じ入力のため、同じ成果物を生成する関数であって、他の機能を生成できない必要があります.
パラメータとして、oldState、dispatchアクションを入力し、新しいステータススナップショット(新しいステータス)を返さなければなりません。
純粋な関数でなければならないため、HTTP通信やローカルストレージ上でデータを操作する方法は純粋な関数ではない(これらのデータが変化すれば、同じ操作でも異なる結果が生じる)ため、reduceにはこれらの操作は含まれません.
reduceは同期コードでなければなりません。
const redux = require("redux");
const initialState = {
counter: 0,
};
const counterReducer = (state = initialState, action) => {
if (action.type === "increment") {
return {
counter: state.counter + 1,
};
}
if (action.type === "decrement") {
return {
counter: state.counter - 1,
};
}
return state;
};
const store = redux.createStore(counterReducer);
const counterSubscriber = () => {
const lastestState = store.getState();
console.log(lastestState);
};
store.subscribe(counterSubscriber);
store.dispatch({ type: "increment" });
store.dispatch({ type: "decrement" });
以上のコードから,redux.createStore()
という関数を用いてstore
を生成し,因数としてreducer
の関数を加え,reducer
の関数に初期値をデフォルト値とするstate
,action
action
がdispatch
に入る因数である.action
のタイプに応じて、reducer
の起動方法が異なる場合、reducer
関数を記述し、そのredux store
を購読すると、この状態が変更され、保存されます.
このredux
の関数が本当に購読されている場合、store
のデータにどのようにアクセスするかは、store.getState()
という関数を使用してstateにアクセスできます.
したがって、上記コードを実行すると、まずstore
が生成され、counterReducer
がパラメータとして受信されたときに第1のreducer関数が実行される.サブスクリプション関数では、lastestState
~store.getState()
がサブスクリプションされ、store
~subscribe
が現在のサブスクリプションの構成部品であることが通知されます.
その後、ショップがcounterReducer
に変更されると、サブスクリプションのstore
関数が実行されます.
Reference
この問題について(楽なアイテム), 我々は、より多くの情報をここで見つけました
https://velog.io/@doodream/Redux-가벼운-프로젝트
テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol
const redux = require("redux");
const initialState = {
counter: 0,
};
const counterReducer = (state = initialState, action) => {
if (action.type === "increment") {
return {
counter: state.counter + 1,
};
}
if (action.type === "decrement") {
return {
counter: state.counter - 1,
};
}
return state;
};
const store = redux.createStore(counterReducer);
const counterSubscriber = () => {
const lastestState = store.getState();
console.log(lastestState);
};
store.subscribe(counterSubscriber);
store.dispatch({ type: "increment" });
store.dispatch({ type: "decrement" });
Reference
この問題について(楽なアイテム), 我々は、より多くの情報をここで見つけました https://velog.io/@doodream/Redux-가벼운-프로젝트テキストは自由に共有またはコピーできます。ただし、このドキュメントのURLは参考URLとして残しておいてください。
Collection and Share based on the CC Protocol