Question

如果我将jsx组件（A）作为道具传递给另一个组件（B），则像这样：

import A from "A.jsx";
import B from "B.jsx";
...
class MyClass extends React{
...
  render(){
    return <B customContent={A} />
  };
}

在React生命周期中更新组件B时，A也会更新吗？

Answer 1

在React中，当渲染组件时，其所有子组件也将被渲染。

在您的情况下，当您将组件A作为属性传递给B时，组件A 将作为常规对象传递给组件B ，并且不会呈现。

例如：如果您传递的是函数而不是组件A，则只有从组件B调用它后，该函数才会执行。

如果您需要在另一个内部动态渲染组件，则应使用 props 对象上的 children 属性，让我向您展示：

在我的课堂上

  class MyClass extends React{
    ...
      render(){
        return <B > 

                 <A />

               </B>
      };
    }

在组件B

您可以执行以下操作：

 class B extends Component{
    ...
      render(){
        return
                <React.Fragment> 

                 {this.props.children}

               </React.Fragment>
      };
    }

将Jsx组件作为道具传递给另一个jsx组件

1 个答案: