Question

我们在渲染方法中使用react-if用于任何非平凡逻辑，否则使用三元逻辑。

原来我们得到一个警告，说明在下面的示例中没有将对象发送到MyComponent（由于其propTypes）。这是因为person为空，我们希望不会呈现MyComponent。看起来<If>创建/初始化MyComponent，即使condition属性为false。

import {If, Then} from 'react-if'
...

render() {
  const person = null

  <If condition={!!person}>
    <Then>
      <MyComponent person={person} />
    </Then>
  </If>
}
...

const MyComponent = ({person}) => (
  <h1>{person.name}</h1>
)    

MyComponent.propTypes = {
  person: PropTypes.object.isRequired
}

除了将人设置为{}或使用三元if之外，还有什么更好的方式？

由于

Answer 1

由于你的人道具可以为空，因此不需要它。

MyComponent.propTypes = {
  person: PropTypes.object
}

本月有一个pull request用于改变这种模棱两可的行为，这将反映在新版本中。

即使react-if的condition属性为false，PropTypes也会发出警告

1 个答案: