redux-actions的产生,是为了简化redux的使用。
createAction
-
Methods
import { createAction } from 'redux-actions';
export const increment = createAction('INCREMENT');
export const decrement = createAction('DECREMENT');
increment(); // { type: 'INCREMENT' }
decrement(); // { type: 'DECREMENT' }
increment(10); // { type: 'INCREMENT', payload: 10 }
decrement([1, 42]); // { type: 'DECREMENT', payload: [1, 42] }
const updateAdminUser = createAction(
'UPDATE_ADMIN_USER',
updates => updates,
() => ({ admin: true })
);
updateAdminUser({ name: 'Foo' });
// {
// type: 'UPDATE_ADMIN_USER',
// payload: { name: 'Foo' },
// meta: { admin: true },
// }
handleAction
-
Methods
import { handleAction } from 'redux-actions';
handleAction(
'APP/COUNTER/INCREMENT',
(state, action) => ({
counter: state.counter + action.payload.amount
}),
defaultState
);
createActions
import { createActions } from 'redux-actions';
createActions({
ADD_TODO: todo => ({ todo }), // payload creator
REMOVE_TODO: [
todo => ({ todo }), // payload creator
(todo, warn) => ({ todo, warn }) // meta
]
});
handleActions
import { handleActions } from 'redux-actions';
const reducer = handleActions(
{
INCREMENT: (state, action) => ({
counter: state.counter + action.payload
}),
DECREMENT: (state, action) => ({
counter: state.counter - action.payload
})
},
{ counter: 0 }
);
官网资料:https://redux-actions.js.org/
参考资料:https://www.jianshu.com/p/d2615a7d725e