getElementById react-native [英] getElementById react-native

问题描述

如何获取本机元素?

我的用例是一个登录屏幕.按下提交按钮，现在我想获取用户名和密码TextInputs的值.

My use-case is a login screen. the submit button is pressed and now i want to get the value of username and password TextInputs.

      export default class Login extends Component 
      {
        login()
        {
          //document.getElementById('username'); //run-time error
        }
        render() 
        {
          return (

            <View style={{flex: 1,flexDirection: 'column',justifyContent: 'space-between',margin:10}}>
              <View style={{backgroundColor: 'powderblue'}} />
              <MyTextField id='user' placeholder="User Name" />
              <MyTextField id='pass' placeholder="Password" />
              <MyButton onPress={this.login} title='Login'/>
            </View>

          );
        }
      }

推荐答案

您没有在本地响应中获取getElementById，必须使用状态.您可以这样做:

You don't have get getElementById in react native, you have to use state. you can do like this:

  export default class Login extends Component {

      constructor (props) {
          super(props);
          this.state={
              email:'',
              password:''
          }
          this.login = this.login.bind(this); // you need this to be able to access state from login
      }

      login() {
          console.log('your email is', this.state.email);
          console.log('your password is', this.state.password);
      }

      render() {
          return (
            <View style={{flex: 1,flexDirection: 'column',justifyContent: 'space-between',margin:10}}>
              <View style={{backgroundColor: 'powderblue'}} />
              <TextInput onChangeText={(email) => {
            this.setState({email})/>
                 <TextInput secureTextEntry={true} onChangeText={(password) => {
            this.setState({password})/>
              <MyButton onPress={this.login} title='Login'/>
            </View>
          );
        }
      }

这篇关于getElementById react-native的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！