如何使用反应钩，检查道具和渲染适当的组件？(临时)
如何使用反应钩，检查道具和渲染适当的组件？(临时)
提问于 2020-04-14 11:11:48
最初，道具中没有地产国家。因此，如果支持中没有country属性，我需要显示加载消息，但问题是它会一直呈现加载元素，甚至属性国家也存在。因此，国产化是在某个时候出现的，专案必须检查这一点。我不确定做得好。
const loadingComponent = (WrappedComponent) => {
return (props) => {
const [loading, setLoading] = useState(true);
useEffect(() => {
if (props.country) return setLoading(false);
}, [props]);
return !loading ? <WrappedComponent {...props} /> : <p>Loading ...</p>;
};
};我试图避免使用类订单组件。或者有其他方法来创建临时加载吗？谢谢
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-04-14 11:35:26
在这种情况下，你实际上不需要一个州。如果存在支柱，则呈现组件，如果不呈现加载：
const loadingComponent = WrappedComponent =>
props =>
props.country ?
<WrappedComponent {...props} />
:
<p>Loading ...</p>;我将创建一个更通用的组件，它接受一个谓词来检查是否需要加载：
const loadingComponent = (predicate, WrappedComponent) =>
props =>
predicate(props) ?
<WrappedComponent {...props} />
:
<p>Loading ...</p>;然后你可以像这样使用它：
const Wrapped = (props => 'country' in props, ComponentX);或者检查其他东西
const Wrapped = (({ a }) => a < 5, ComponentY);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/61206337
复制相关文章
相似问题
腾讯云开发者
