javascript – 无法在本机中呈现onPress TouchableOpacity视图

2023年1月16日 200次阅读

嘿伙计们,请你帮我解决这个问题.

我想在按下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})} …>

点赞