Question

我的问题是：我想在每次按键时渲染一个视图组件。但默认情况下，它仅调用2次。按钮不起作用。我不知道我在哪里做错了。请帮忙。谢谢。

function renderBottomComponent() {
        console.log("here");
            return (
                <View>
                    <Content />
                </View>
            )

    }


  <View style={styles.List}>
                       <View> 
                           <Content abc={this.mhandler} hel={'hahah'}/>

                       </View>

                       {this.renderBottomComponent()}

                </View>



<Button title="Add more" color='green' onPress={this.renderBottomComponent} />

Answer 1

export default class YourClass extends React.Component() {
  constructor(props) {
    super(props);
    this.state = {
        renderComponent: false
    };
    this.onClickHandler = this.onClickHandler.bind(this);
  }

  onClickHandler() {
    this.setState({renderComponent: !this.state.renderComponent})
  }

  render() {
    return (
        <View>
            {this.state.renderComponent && <YourComponent/>}
            <Button title="Add more" color='green' onPress={this.onClickHandler} />
        </View>
    );
}

希望对您有帮助

如何在React Native中的按钮上添加视图组件？

1 个答案: