javascript - 返回组件时如何重构&&()

Question

我最近进入了一个项目，开发人员正在使用这种不熟悉的语法，他们做了这样的事情:

    {this.props.something === 'Foo' && (
      <React.Fragment>
       Here
      </React.Fragment>
    )}

我还能怎样重写这个？

Answer 1

由于short circuiting in JavaScript ，整个代码基本上要么评估为 false 如果条件

 this.props.something === 'Foo' 

未满足，否则(如果条件满足)它将评估为以下 React 组件实例。由于 React 会在渲染过程中过滤掉虚假值(包括 false)，因此如果某些内容是 foo，则会渲染 Fragment，否则不会渲染任何内容。