嘿伙计们,请你帮我解决这个问题.
我想在按下TouchableOpacity时渲染视图,但它不起作用.可以请任何建议最好的解决方案.
import React, { Component } from 'react';
import {
AppRegistry,
View,
TouchableOpacity
} from 'react-native';
export default class App extends Component {
constructor(props){
super(props);
this._renderMyView.bind(this);
}
_renderMyView = () => {
<View>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
<Text>I am here to returns camera</Text>
</View>
}
render() {
return (
<TouchableOpacity onPress={this._renderMyView} style={{height:50,width:50,backgroundColor:'red'}} >
<Text style={{height:50,width:50,backgroundColor:'red'}} >camera</Text>
</TouchableOpacity>
);
}
}
最佳答案 目前,您的组件在呈现视图时可以依赖于它们.它可以简单地解决:
>将状态添加到组件,例如:state = {renderView:false}
>添加条件渲染,depand你的状态:
render(){
回来(
<TouchableOpacity onPress={this._renderMyView} style={{height:50,width:50,backgroundColor:'red'}} >
<Text style={{height:50,width:50,backgroundColor:'red'}} >camera</Text>
{this.state.renderView&& this._renderMyView()}
);
}
>从_renderMyView()返回您的视图,因此只需为视图添加返回值.
>按下触发时改变状态:
< TouchableOpacity onPress = {()=> this.setState({renderView:true})} …>