操作必须是纯JavaScript对象
下面是我的行动的创建者代码:操作必须是纯JavaScript对象
export function fetchPosts()
{
const request = axios.get(`${ROOT_URL}/posts${API_KEY}`);
return
{
type: FETCH_POSTS;
payload: request
};
}
下键入:FETCH_POSTS,如果我加入,而不是;我得到错误意外的令牌。这是行动创造者的语法吗?
然后,如果我替换,与;编译后,我得到错误'操作必须是纯Javascript脚本。
任何想法为什么?
当您将,
替换为;
时,您会收到错误消息,因为如错误消息所述,操作必须返回JavaScript对象。
在JavaScript对象的属性应该由,
,可以分离:
return
{
type: FETCH_POSTS, // use comma here
payload: request
};
这样的return
语句将返回一个新的对象具有两个属性type
和。
GibboK的回答已经指出了语法错误。
但是,我不认为你理解正确使用动作。你运行:
const request = axios.get(`${ROOT_URL}/posts${API_KEY}`);
这是创造一个承诺。您目前正在回复此操作。减速器意味着确定性的免费副作用&,因此为什么动作应该是纯JS对象。你不应该提交承诺。
相反,您应该使用一些相关的中间件,例如, redux-thunk,redux-saga或其他东西。当实际承诺已经解决时,您应该发送一个动作。
作为一个简单的人为的例子,使用redux-thunk
:
export const fetchPosts =() => (dispatch) => {
// Send action to notify request started. Reducers often want to
// update the state to record that a request is pending, e.g. for
// UI purposes.
dispatch({type: FETCH_POSTS_START});
// Start request
request = axios.get(`${ROOT_URL}/posts${API_KEY}`)
.then(res => {
// Successfully received posts, submit response data
dispatch({type: FETCH_POSTS_COMPLETE, payload: res.data})
})
.catch(err => {
// API call failed, submit error
dispatch({type: FETCH_POSTS_ERROR, payload: err})
});
};
注意此代码只是一个例子,并不一定适合于在生产系统中使用。
作为每redux文档:
Actions
是纯JavaScript对象。操作必须有一个type property
,表示正在执行的操作的类型。通常应将 类型定义为string constants
。一旦您的应用程序足够大,您可能需要将它们移动到单独的模块中。
和行动创造者
行动创造者是创建操作
功能在终极版动作制作者简单地返回一个动作:当你调用
action creator
function addTodo(text) { return { type: ADD_TODO, text } }
所以从您的组件通过dispatch
您的交流灰色创造者只需要简单地返回一个简单的JavaScript对象。
所以正常动作的创造者将
export function fetchPosts()
{
return
{
type: FETCH_POSTS;
payload: "somevalue"
};
}
现在如果你想打电话给你需要使用像redux-thunk
或redux-saga
中间件的同时创造一个商店
像
你的行动创造者中的APIimport thunk from 'redux-thunk';
const store = createStore(reducers, applyMiddleware(thunk));
您可以使用中间件来配置您的商店,您可以将您的操作修改为
export function fetchPosts() {
return (dispatch) => {
axios.get(`${ROOT_URL}/posts${API_KEY}`)
.then((response)=> {
dispatch({
type: FETCH_POSTS,
payload: request
})
})
}
}
由于每redux-thunk文档
为什么你需要终极版,形实转换?
Redux Thunk middleware
允许您编写动作创建者,该动作创建者 返回一个函数而不是动作。 thunk可用于延迟dispatch
的动作,或者仅在满足某个 条件时才可以使用dispatch
。内部函数接收存储方法dispatch and getState
作为parameters
。
你应该返回一个对象。对象属性由','not';'定界,所以它应该是'type:FETCH_POSTS,' –
[Actions必须是React/Redux中的普通对象?](https://*.com/questions/39693161 /动作-必须待纯对象 - 在反应的-终极版) –