React-Redux: передача аргументов от обработчика создателю действия - PullRequest
0 голосов
/ 23 мая 2018

Я исследовал сеть и различные источники;похоже, никто не относится к моему вопросу.Наиболее близким может быть следующее (у которого нет ответа): вызов функции React + Redux

Итак: я пытаюсь передать аргументы одному из моих полей создателя действия,функция с именем update, которая будет определять, изменилось ли значение в размытой строке, и если это так, то вызовет мой API для обновления.Аргументы, которые я хочу передать, - это событие (которое содержит нужную мне строку как target.ParentElement) и целое число, представляющее индекс строки в свойстве projects моего состояния.

Actionсоздатель в моем магазине приставок:

export const actionCreators = {
    update: (e: React.FocusEvent<HTMLInputElement> | undefined, i: number): AppThunkAction<KnownAction> => (dispatch, getState) => {
        let test = event;
        // Will put logic and api call in here and dispatch the proper action type
    }
}

И пытаюсь назвать его так:

// Inside a function rendering each row in my form 
...
<input key={project.number} name={name} className='trackerCell' onBlur={(event) => { this.props.update(event, i) }} defaultValue={project.number}/>

Где i - значение индекса, переданное в функцию рендеринга.

Это все компиляции находят, однако, когда я выполняю и попадаю в функцию update , e и i оба не определены; событие определено, однако, и выглядит так, как я ожидал бы e .

FWIW, формат, который я пытаюсь здесь использовать, работает в другом месте в моем приложении:

requestProjects: (programNumber: number, programString: string): AppThunkAction<KnownAction> => (dispatch, getState) => {

при вызове componentWillUpdate () правильно получает число и строку, которые я могу использовать в своей логике.

Бонус: во всех моих функциях создателя действий, сконструированных таким образом, Аргументы содержат 3 объекта: dispatch , getState и undefined .Почему не отображаются аргументы в подписи вызова?Думаю ли я об этих аргументах по-другому?

И да, я знаю, что могу просто прикрепить значение индекса к атрибуту в моем входе, и это появится в объекте event , но это кажетсяхак, и я действительно хочу понять, что здесь происходит.

Спасибо

ОБНОВЛЕНИЕ

В ответ на комментарий Уилла Кейна: переменная индекса, i, передается в функцию рендеринга строки от ее родителя следующим образом:

private renderProjectRow(project: ProjectTrackerState.Project, i: number) {
    let cells: JSX.Element[] = [];
    let someKey = project.number + '_started', name = project.number + '_number';
    cells.push(<input key={project.number} name={name} className='trackerCell' onBlur={ this._handleBlur.bind(this) } defaultValue={project.number}/>);
// Rendering continues down here

Это допустимый тип числа до точки события (я могу сказать, как я отлаживаю в браузере).

Переменная события в функции обновления происходит от .. Я не знаю где?Это загадка, которую я бы хотел разгадать.Даже если это не определенный параметр для функции обновления, когда я вхожу в метод update , в отладчике определяется событие как таковое:

Event {isTrusted: false, type: "react-blur", target: react, currentTarget: react, eventPhase: 2, …}

Очевидно, что это событие, котороесработал обработчик, но то, как он достигает функции update , мне не подходит.

1 Ответ

0 голосов
/ 24 мая 2018

Ответ на этот вопрос в случае, если кто-нибудь сталкивался с такой же проблемой (маловероятно, но хочет быть полезным):

Причина, по которой мои аргументы e и i были неопределеннымиво время выполнения, потому что они не были упомянуты при выполнении функции.Я предполагаю (все еще ищу документацию для проверки), что машинописный текст очищает ссылки на неиспользуемые параметры.Имеет смысл с точки зрения оптимизации.Добавление ссылки на чтение к e и i в функции update решило мою проблему.

Вы можете добавить "noUnusedParameters": true к своему compilerOptions в вашем tsconfig файле, и это приведет к ошибке машинописи для всех этих параметров, чтобы вы могли отследить, когда будут выполнены эти очистки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...