如何在 React Native 中呈现包含视图的函数？

Question

如何在 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>
            );
        }
   }

Answer 1

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

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

Answer 2

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

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

或使用 bind(this) 如：

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

因为你调用的是函数。

Answer 3

试试这个，在 return _renderMapView 中缺少 ():

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

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

Answer 4

终于得到答案删除绑定并添加return();

谢谢大家！

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

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

如何在 React Native 中呈现包含视图的函数？

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

javascript

reactjs

react-native