Redux / Вызов из акции - PullRequest
Новая
       3

Redux / Вызов из акции

0 голосов
/ 11 января 2020

Как я могу отправить действие внутри из действия, не передавая его из первоначального вызова? Я просто хочу удалить props.dispatch, но я не могу заставить его работать. Уже использую redux-thunk, и я новичок, чтобы реагировать. Моя версия работает, но она не самая лучшая, я думаю. 

<Files
    onDrop={file => {
        props.dispatch(addFile(props.dispatch, {id: uuidv4(), file}));
    }}
/>

действия. js: 

// addFile
export function addFile(
    dispatch,
    {
        id = uuidv4(),
        file = [],
    } = {}
) {
    doSomething(dispatch, id);
    return {
        type: 'ADD_FILE',
        payload: {
            id,
            file,
        },
    };
}

// doSomething
function doSomething(dispatch, id) {
    dispatch(callOtherAction(id));
}

Ответы [ 2 ]

0 голосов
/ 12 января 2020

Если вы используете redux-thunk, то ваши действия могут выглядеть следующим образом: 

// actions.js
export function addFile(id = uuidv4(), file = []) {
  return dispatch => {
    dispatch(doSomething(id));

    dispatch({
        type: 'ADD_FILE',
        payload: {
            id,
            file,
        },
    });
  }
}

function doSomething(id) {
  return dispatch => {
    dispatch(callOtherAction(id));
  }
}

// component.js
import { addFile } from './actions.js';

const YourComponent = ({ addFile }) => <button onClick={() => addFile(id, file)}>Add File</button>;

export default connect(null, { addFile })(YourComponent)

Нет необходимости передавать dispatch метод в качестве аргумента.

0 голосов
/ 11 января 2020

Вы можете использовать mapDispatchToProps и передать его в качестве второго параметра методу соединения. Тогда у вас будет метод отправки вместе с вашими реквизитами.

должен выглядеть примерно так: 

const mapDispathToProps = dispatch => ({
    addFileAction: (file) => addFile(dispatch, file)
})
export default connect(null, mapDispathToProps)(Component);

Ваше действие addFile теперь может передавать отправку и другим действиям.

...