javascript - 确定 react 组件是否为空

Question

我有一个组件在满足某些条件时呈现，否则它返回 null。

我想知道如何确定组件是否从其父级返回 null。

我已经尝试记录组件以查看在呈现时或返回 null 时哪些属性发生了变化，但无法检测到任何差异。

有什么建议吗？

Answer 1

您可以只使用后备 Prop 。

代替:

function Child(){
 if(something) return null

 return <div>content</div>
}

function Parent(){
 // try to find out if child is null
 return <Child />
}

只是做:

function Child({ fallback = null }){
 if(something) return fallback

 return <div>content</div>
}

function Fallback() {
 return 'some fallback'
}

function Parent(){
 return <Child fallback={<Fallback />} />
}