通常在Redux(thunk)中,动作创建者是静态方法。但是我有一个特定的场景,其中动作创建者需要对不同的端点进行异步调用。一种方法是传入一个标志来确定要去的端点:
function _getEndPoint(isHouse) {
return isHouse ? 'house' : 'flat';
}
export function post(model, isHouse = false) {
return (dispatch, getState) => {
dispatch({
types: [POST, POST_SUCCESS, POST_FAILED],
promise: (client) => client.post(`${_getEndPoint(isHouse)}`, {
data: model,
}),
});
};
}
但有没有办法创建一个类Property
,post
作为公共方法,作为操作方法。因此,当我实例化Property
类时,我定义属性的类型并在创建时设置正确的端点?
来自C#背景,我也想知道我是否可以使用泛型或继承来解决这个问题。
此外,这是一个很好的做法,尝试用类创建动作方法,因为我读到Redux更多的是编程的功能风格。
答案 0 :(得分:0)
如果必须调用不同的端点(异步或非异步) - 这些是不同的操作。假设你想要处理错误。通用类型POST_FAILED
不会告诉您哪个资源发生了故障。如果要根据它更改状态树怎么办?如果应以各种方式处理不同类型怎么办?功能方法POST_OF_SOMETHING_FAILED
在这里更适合。小功能做小事。否则,您将不得不使用复杂的if
块。
您可以实现某种动作生成器来摆脱代码重复,而不是使用类和继承。例如,如果要创建共享CRUD操作,则创建操作可能如下所示:
/actions/generators/create.js
import fetch from 'isomorphic-fetch';
function requestCreateItem(modelName) {
return {
type: `CREATE_${modelName.toUpperCase()}_REQUEST`,
};
}
function receiveCreateItem(modelName, item) {
return {
type: `CREATE_${modelName.toUpperCase()}_SUCCESS`,
item,
receivedAt: Date.now(),
};
}
function catchCreateItemError(modelName, error) {
return {
type: `CREATE_${modelName.toUpperCase()}_ERROR`,
error,
receivedAt: Date.now(),
};
}
function createItem(modelName) {
return (dispatch) => {
dispatch(requestCreateItem(modelName));
return fetch(`/${modelName}s`, {
method: 'POST',
credentials: 'same-origin',
}).then(response => response.json()).then(json => {
if (json.error) {
dispatch(catchCreateItemError(modelName, json.error));
} else {
dispatch(receiveCreateItem(modelName, json));
}
}).catch(error => {
dispatch(catchCreateItemError(modelName, error));
});
};
}
export default function create(modelName) {
return () => createItem(modelName);
}
您可以在动作索引文件中将其用作构造函数。
/actions/index.js
import create from './generators/create';
const createBot = create('bot');
export const botActions = { createBot };
这是主要想法。