我想知道这是否是干燥这段代码的更好方法,你们有什么想法吗? Prop 是一样的,只是组件改变了......
render() {
const { input: { value, onChange }, callback, async, ...rest } = this.props;
if (async) {
return (
<Select.Async
onChange={(val) => {
onChange(val);
callback(val);
}}
value={value}
{...rest}
/>
);
}
return (
<Select
onChange={(val) => {
onChange(val);
callback(val);
}}
value={value}
{...rest}
/>
);
}
最佳答案
与:
let createElement = function(Component) {
return (
<Component onChange={(val) => {
onChange(val);
callback(val);
}}
value={value}
{...rest}
/>
);
};
你可以做到
let selectAsync = createElement(Select.Async);
let select = createElement(Select);
您可以使用 {{select}} 和 {{selectAsync}} 在 jsx 部分渲染它们
P.S.:我没有直接测试这个,但几天前做了一些非常类似的事情,所以这种方法应该有效。请注意,Component 必须以大写字母开头。
关于javascript - DRY jsx 渲染方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41465768/