Question

我创建一个const backText，返回<Text />并将其放入render，但它没有显示出来。

我认为它应该有用，但它会显示黄色警告

函数作为React子函数无效。

这是我的render

render() {
    const backText = () => {
      return (
        <Text>Test</Text>
      );
    };

        return (
          <View style={{ flex: 1, backgroundColor: '#B0E0E6' }}>
            <View style={{ flex: 0.9, justifyContent: 'center', alignItems: 'center' }}>
              <Text>Three !</Text>
            </View>

            <View style={{ flex: 0.1, alignItems: 'center', marginBottom: 15 }}>
              <ActivityIndicator size="large" color="#ffffff" />
              <Text style={{ fontSize: 16, marginTop: 8, color: 'gray' }}>Loading...</Text>
              {backText}
            </View>

          </View>
        );
      }

任何帮助将不胜感激。提前谢谢。

Answer 1

您可以像这样更改代码：

backText = () => {
  return (
    <Text>Test</Text>
  );
}

render() {
        return (
          <View style={{ flex: 1, backgroundColor: '#B0E0E6' }}>
            <View style={{ flex: 0.9, justifyContent: 'center', alignItems: 'center' }}>
              <Text>Three !</Text>
            </View>

            <View style={{ flex: 0.1, alignItems: 'center', marginBottom: 15 }}>
              <ActivityIndicator size="large" color="#ffffff" />
              <Text style={{ fontSize: 16, marginTop: 8, color: 'gray' }}>Loading...</Text>
              {this.backText()}
            </View>

          </View>
        );
      }

函数作为React子函数无效

1 个答案: