如何在react native中呈现包含视图的函数?

How do I render a function which contain a view in react native?

本文关键字:视图 包含 函数 react native      更新时间:2023-09-26

如何在react native中呈现包含视图的函数?我得到的是一个空白的屏幕

这个行不通:

    class App extends React.Component {
        render() {
            return (
                <View style = { styles.container }>
                    {this._renderMapView.bind( this )}
                </View>
            );
        }
        _renderMapView () {
             return <MapView style = { styles.mapView } </MapView>
        }
   }

如此:

    class App extends React.Component {
        render() {
            return (
                <View style = { styles.container }>
                    <MapView style = { styles.mapView } </MapView>
                </View>
            );
        }
   }

试试这个。不使用bind(this) .

<View style = { styles.container }>
    {this._renderMapView()}
</View>

或使用bind(this),如:

<View style = { styles.container }>
    {this._renderMapView.bind(this)()}
</View>

可能是因为_renderMapView没有返回任何东西?

 _renderMapView () {
          return  <MapView style = { styles.mapView } </MapView>
 }

试试这个,在return _renderMapView missing()中:

class App extends React.Component {
    render() {
        return (
            <View style = { styles.container }>
                {this._renderMapView.bind( this )}
            </View>
        );
    }
    _renderMapView () {
         return (<MapView style = { styles.mapView } </MapView>);
    }
 }

终于得到答案了remove bind and add return();

谢谢大家!

class App extends React.Component {
    render() {
        return (
            <View style = { styles.container }>
                {this._renderMapView()}
            </View>
        );
    }
    _renderMapView () {
         return (
             <MapView style = { styles.mapView } </MapView>
        );
    }
 }