this.setState 反应本机

Question

4天前开始学习React native。我正在尝试将属性 this 传递给另一个 Scene，但是，我一直 遇到此错误 _this.setState is not a function。我相信这不是重复的，因为我已经通读了这两个 Stack 答案，他们的解决方案似乎对我没有帮助。我有一些不同的设置，所以我认为这可能是问题所在。

我知道 React 在这一年里发生了很大的变化（并且经常这样做）这些问题得到了回答所以我想也许这就是为什么它们不适合我的原因。

import React, { Component } from 'react';
import { StyleSheet, Text, View, TouchableOpacity, TextInput, Platform, } from 'react-native';
import { Actions } from 'react-native-router-flux';

const Social = () => {
state = {
  name: ''
} 
return (
  <View style={ styles.container }>
    <Text style={ styles.Name } onPress={() => Actions.homepage()}>
      Enter your Name:
    </Text>

    <TextInput style={ styles.TextInput} placeholder='PrimeTimeTran' onChangeText={(text) => {
      this.setState({
         name: text,
      })
    }}
      value={this.state.name}
    />
    <TouchableOpacity
      onPress={() => {
        alert(self.state.name)
      }}
    >
      <Text style={ styles.buttonText }>
        Next
      </Text>
    </TouchableOpacity>
  </View>
 );
}

export default Social;

我正在关注此 tutorial 此处 (22:39)，他似乎顺利解决了我的问题。本教程制作于 2016 年 11 月 1 日，所以我相信他的语法应该没有问题。

还有一个可能重要注意，

我看到的唯一区别是，对于我的构造函数，我没有将 render() 与 return() 一起使用，而是单独使用 return()；这可能是问题所在吗？

提前致谢！

Answer 1

您的社交组件是一个无状态功能组件（在此处使用 () => {} 语法创建）；这是一个纯粹的 javascript 函数。因此 setState 将不可用。如果你需要组件来管理它自己的状态，你需要通过扩展 React.Component:

来创建它

https://facebook.github.io/react/docs/react-component.html#setstate

因此，您可以按如下方式声明您的组件：

class Social extends React.Component {
  //...implementation here
}

然后您将可以访问 setState 以及其他组件生命周期方法。

(您添加的附加说明也是因为您使用的是无状态功能组件 - 这些有效地实现了 render 功能，所以您可以看到的只是 return 该函数的一部分。)

this.setState 反应本机

this.setState React Native

javascript

native

reactjs

还有一个可能重要注意，