onChangeText在响应本机中给出错误

时间:2020-09-06 13:16:38

标签: react-native react-native-android setstate

我有以下代码

Lola
onChangeText我遇到这样的错误

   import React from 'react';
   import { StyleSheet,Text,View,SafeAreaView,ScrollView ,Image ,TextInput} from 'react-native';     
   import  Entypo  from 'react-native-vector-icons/Entypo';
   import { Neomorph } from 'react-native-neomorph-shadows';

export const HomeScreen = ({ navigation }) => {
  state = {
    fname : "",
    sname : "",
  }
  
  return(  <SafeAreaView style={{ alignSelf: "stretch" }}>
            <View style={styles.card}>
              <Neomorph style={styles.neomorph} >
                <Text style={styles.input_title}>First Name</Text>
                  <Neomorph inner style={styles.input} >
                  <TextInput
                    style={{ borderColor: 'transparent', borderWidth: 1 ,width: "100%" ,borderRadius: 8,height: 50,paddingLeft: 10,fontSize: 18,fontWeight:"bold",color:"#ffffff"}}
                    onChangeText={(nextValue) => this.setState({fname: nextValue})}
                    value={this.state.fname}
                  />
                  </Neomorph>
              </Neomorph>
            </View>
            <View style={styles.card}>
              <Neomorph style={styles.neomorph} >
                <Text style={styles.input_title}>Second Name</Text>
                  <Neomorph inner style={styles.input} >
                  <TextInput
                    style={{ borderColor: 'transparent', borderWidth: 1 ,width: "100%" ,borderRadius: 8,height: 50,paddingLeft: 10,fontSize: 18,fontWeight:"bold",color:"#ffffff"}}
                    onChangeText={(nextValue) => this.setState({sname: nextValue})}
                    value={this.state.sname}
                  />
                  </Neomorph>
              </Neomorph>
            </View>
 </SafeAreaView>
)
}

谁能帮助我解决这个问题 在此先感谢

1 个答案:

答案 0 :(得分:0)

您正在使用功能组件,因此该位置不支持状态。

您可以切换到如下所示的基于类的组件

export class HomeScreen extends Component {
  state = {
    fname : "",
    sname : "",
  }
  
  render()
{
 //return jsx
}
}

或使用如下所示的useState钩子

export const HomeScreen = ({ navigation }) => {
  const [fname,setfname] = React.useState("");
  
  return()
}

您可以使用setfname(“ value”)设置值。