我想给第一个子代添加一个额外的道具,这个子代的道具类型是 scan
这样我就可以在渲染的第一个扫描组件上启用自动对焦?
这是我目前所做的。
import React, { cloneElement } from 'react;
export default function Form({ children }) {
const [focus, setFocus] = useState(false);
...
return (
<form onSubmit={onSubmit}>
{children.map((child, i) => {
if (child.props.config.type === "scan" && !focus) {
cloneElement(child, { focus: true });
return setFocus(true);
}
return cloneElement(child, { focus: false });
})}
</form>
);
});
任何建议都将是巨大的,谢谢
在你的代码中,有两件事是有问题的。
setFocus
而不是 cloneElement
从映射函数setFocus
直接在渲染中使用。如果你必须知道是否有一个扫描道具的子代,可以利用useRef
export default function Form({ children }) {
const focus = useRef(false);
...
return (
<form onSubmit={onSubmit}>
{children.map((child, i) => {
if (child.props.config.type === "scan" && !focus.current) {
focus.current = true;
return cloneElement(child, { focus: true });
}
return cloneElement(child, { focus: false });
})}
</form>
);
});