确定react组件是否为null

Question

我有一个组件,如果满足某些条件则呈现,否则返回null.

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

我已经尝试记录组件以查看在渲染时或返回时哪些属性正在发生变化,null但无法检测到任何差异.

有什么建议？

Answer 1

你可以只使用后备道具。

代替：

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 />} />
}