javascript - 用于条件渲染的容器或组件

Question

当涉及渲染错误、加载或空状态时，最佳实践是什么？

让容器控制渲染更好，还是让它本质上引用的组件控制渲染更好？

例如

render() {
    const {
       loading,
       error,
       items 
    } = this.state;

    return (
       <div>
          {
             loading &&
             <Loading />
          }
          {
             error &&
             <Error />
          }
          etc...

或

const ItemList = ({ items, loading, error }) => {
    if (loading) {
       return <Loading />
    }
    etc...

欢迎/赞赏所有意见。 谢谢!

Answer 1

我认为我们应该制造尽可能多的组件。它使代码更加清晰，组件更加实用。

在您的情况下，逻辑应该位于基本组件中。我认为，你的组件应该只对他自己的观点负责。并且它不应该知道它应该显示的逻辑。