react native 在 reducer 中获取异步初始状态
react native get async initial state in reducer
据我了解,在 reducer 中总是有一个静态的 initialState,现在我想从远程服务器异步获取初始状态,我知道如何获取它们,并且我可以在相关的展示组件中的 componentWillMount 中执行此操作,但它不只是用于演示吗?在与商店连接之前,我应该将获取代码放在下面的什么位置并获取初始状态?
getInitailState = () => {
return (
fetch(apis.GETINITAILURL)
.then((response)=>response.json())
.then((responseJson) => {
return responseJson;
})
.catch(e=>e)
)
}
这里是 reducer 的原始完整代码:
import * as TYPES from '../actions/types.js';
import ApiUtils from '../utils/ApiUtils.js';
const initailTaskState = [{
"taskid": 1,
"priority": 3,
"desc": "Bug fix",
"timestamp": 5
}]
const tasks = (state = initailTaskState , action) => {
switch(action.type){
case TYPES.ADD_TASK:
return [
...state,
action.task
]
case TYPES.DELETE_TASK:
return state.filter( task => task.taskid !== action.taskid);
default:
return state
}
}
export default tasks;
获取代码应该放在动作创建器中。此操作应在 componentWillMount 中分派。在 action 中执行一个 fetch,并在 fetch 的成功回调中分派另一个更新 store 的 action。
也通过 this 线程。关于将 API 调用放置在正确位置的讨论很好。
据我了解,在 reducer 中总是有一个静态的 initialState,现在我想从远程服务器异步获取初始状态,我知道如何获取它们,并且我可以在相关的展示组件中的 componentWillMount 中执行此操作,但它不只是用于演示吗?在与商店连接之前,我应该将获取代码放在下面的什么位置并获取初始状态?
getInitailState = () => {
return (
fetch(apis.GETINITAILURL)
.then((response)=>response.json())
.then((responseJson) => {
return responseJson;
})
.catch(e=>e)
)
}
这里是 reducer 的原始完整代码:
import * as TYPES from '../actions/types.js';
import ApiUtils from '../utils/ApiUtils.js';
const initailTaskState = [{
"taskid": 1,
"priority": 3,
"desc": "Bug fix",
"timestamp": 5
}]
const tasks = (state = initailTaskState , action) => {
switch(action.type){
case TYPES.ADD_TASK:
return [
...state,
action.task
]
case TYPES.DELETE_TASK:
return state.filter( task => task.taskid !== action.taskid);
default:
return state
}
}
export default tasks;
获取代码应该放在动作创建器中。此操作应在 componentWillMount 中分派。在 action 中执行一个 fetch,并在 fetch 的成功回调中分派另一个更新 store 的 action。
也通过 this 线程。关于将 API 调用放置在正确位置的讨论很好。