Question

说我有一个简单的组件..

const SimpleComponent = () => {
  return (
    <p>Hello!</p>
  );
}

如果我将SimpleComponent导入某个组件，然后发送如下操作：

this.props.dispatch(someActionOfMine(SimpleComponent));

如何让其他组件将此组件呈现为this.props.children？

例如，这里AnotherComponent：

class AnotherComponent extends React.Component {
  render() {
    return (
      {React.cloneElement(this.props.children, { ...this.props })}
    );
  }
}

在某些组件的渲染中可能会像这样使用：

render() {
  return (
    <AnotherComponent>{this.props.somePieceOfState.component}</AnotherComponent>
  );
}

这可以吗？我正在尝试但它提供了这个错误：

invariant.js：44未捕获错误：元素类型无效：预期a string（用于内置组件）或类/函数（用于复合组件）但得到：未定义。你可能忘了导出你的来自其定义的文件中的组件。

Answer 1

别介意我是个白痴。您需要传递这样的组件：this.props.dispatch(someAction(<SomeComponent />))

反应+减少。我可以调度一个动作来获取一个组件并让另一个组件通过this.props.children呈现它吗？

1 个答案: