React-Redux:将参数从处理程序传递到操作创建者



我已经搜索了网络和各种来源;似乎都不适用于我的问题。最接近的可能是这个(没有答案(: React + Redux 函数调用

所以:我正在尝试将参数传递给我的操作创建者字段之一,一个名为 update 的函数,它将确定模糊行的值是否发生了变化,如果是,它将调用我的 api 进行更新。我希望传递的参数是事件(其中包含我需要作为目标的行。ParentElement( 和一个整数,该整数表示我所在州的projects属性中行的索引。

我的 redux 商店中的动作创建器:

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是索引值,传递给呈现函数。

这一切都是编译发现的,但是当我执行并进入更新函数时,ei都是未定义的;事件是定义的,看起来就像我希望e看起来一样。

FWIW,我在这里尝试的格式在我的应用程序中的其他地方工作:

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

当由组件调用时,WillUpdate(( 正确接收一个我可以在我的逻辑中使用的数字和字符串。

奖励:在我以这种方式构建的所有动作创建器函数中,参数中有 3 个对象:调度getState未定义。为什么呼叫签名中的参数不显示?我是否以不同的方式思考这些论点?

是的,我知道我可以将索引值附加到输入中的属性,该属性将出现在事件对象中,但这似乎很笨拙,我想真正了解这里发生了什么。

谢谢

更新

回应Will Cain的评论:索引变量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, …}

显然是触发处理程序的事件,但它如何到达更新功能超出了我的范围。

回答这个问题以防有人遇到同样的问题(不太可能,但希望有所帮助(:

我的参数ei在运行时未定义的原因是因为它们在函数执行中没有被引用。我的猜测(仍在寻找文档进行验证(是打字稿会清理对未使用参数的引用。从优化的角度来看是有道理的。在更新函数中添加对ei的读取引用解决了我的问题。

您可以将"noUnusedParameters": true添加到tsconfig文件中的compilerOptions中,这将为所有这些参数抛出打字稿错误,以便您可以捕获何时完成这些清理。

最新更新