javascript - HTML onSubmit / onClick 处理函数可以有除事件之外的另一个参数吗?
问题描述
我面临一些情况onClick
或onSubmit
功能需要event
和parameter
. 我可以在 react 或 vanilla html 标签中使用它吗?
或者,只是使用其他功能做一些副作用?
const CustomFC = ({}) => {
const [ id, setId] = useState("");
const [password, setPassword] = useState("");
type FormParams = {
id: string;
password: string;
}
const customClickHandler = useCallback((params: FormParams) =>
{
dispatch(params);
}, [id, password]);
const onChangeId = useCallback((id) => setId(id),[]);
const onChangePassword = useCallback((password) => setPassword(password),[]);
<Form
onClick ={customClickHandler}
onChange={{onChangeId, onChangePassword}}
/>
}
// Form.tsx
const Form = ({
onSubmit,
onChange,
}) => {
const { onChangeId, onChangePassword } = onChange;
const handleSubmit = ( e, params ) => { // <- can this be possible?
e.preventDefault();
onSubmit(params);
}
return (
<form onSubmit={handleSubmit}>
<input ... />
<input ... />
</form>
)
}
解决方案
是的,您可以这样做:
const handleClick = (event, parameter) => {
// do stuff
}
然后像这样调用它:
onClick={(event) => handleClick(event, parameter)}
这有帮助吗?
在您的情况下,它将是:
return (
<form onSubmit={(event) => handleSubmit(event, parameter)}>
<input ... />
<input ... />
</form>
)
推荐阅读
- python - 这种多层感知器反向传播实现有什么问题?
- android - 如何在kotlin android中使用带有背景按钮的If?
- ios - 更改部署目标后出现错误
- r - 如何从 R 中的非平稳广义帕累托(GP)模型中提取参数?
- azure-web-app-service - 我的 Azure Web 应用程序报告了与内存相关的自动修复。Proactive Auto Heal 如何知道何时重新启动我的 Web 应用程序?
- python - ckeditor_uploader 动态图片上传路径
- python - TypeError 与功能,但工作正常,否则
- haskell - 为什么这个 Functor 的实例化不起作用?
- python - 用jinja2或python中的正则表达式替换字符串中的相同字符序列
- r - ggplot2:数字 x 轴上的自定义分类标签