Question

我有一个像这样的组件 <A componentAsProps={<Text>Some Text</Text>} />

如何在render方法中呈现componentAsProps

Answer 1

你可以这样做：

renderChildCompo = () => <Text>Some text</Text>;

render() {
 return (
   <A componentAsProps={this.renderChildCompo} />
 );
}
// ...

在你的./A/index.js文件中

render() {
 return (
  {this.props.componentAsProps()}
 );
}

Answer 2

您可以将组件作为子项传递：

父组件：

<ChildComponent>
     <Text>Some Text</Text>
</ChildComponent>

子组件：

class ChildComponent extends Component {
    render() {
        return (
            <View>
                {this.props.children}
            </View>
        );
    }
}

或你可以传递一个值作为道具并像这样使用它：

父组件：

<ChildComponent text="Some Text" />

子组件：

<Text>{this.props.text}</Text>

Answer 3

我找到了所有我需要做的答案 {this.props.componentAsProps} 在子组件的render方法中

如何渲染作为Prop发送的组件

3 个答案: