Question

我正在调查Android上的react-native，并希望实现一个简单的登录屏幕。

我已设法在我的index.android.js文件中构建用户界面，如下所示： -

<View style={styles.container}>
<TextInput style={{height: 40, width : 300, borderColor: 'gray', borderWidth: 1, marginTop: 8}}
        onChangeText={(username) => this.setState({username})}
        placeholder = 'Username'
        value={this.state.username}
        returnKeyType = {"next"}
        autoFocus = {true}
        onSubmitEditing={(event) => {this.refs.SecondInput.focus();}}/>
<TextInput style={{height: 40, width : 300, borderColor: 'gray', borderWidth: 1, marginTop: 4}}
        onChangeText={(password) => this.setState({password})}
        placeholder = 'Password'
        secureTextEntry={true}
        ref='SecondInput'
        value={this.state.password}/>
<TouchableHighlight style= {styles.submit}
        onPress = {this.onPressLoginButton.bind(this)}>
<Text>L O G I N</Text>
        </TouchableHighlight>
        </View>

当点击我的LOGIN按钮时，将输入的用户名和密码发回Android Java代码的“最佳实践”是什么？

目前我已创建了自定义ReactContextBaseJavaModule＆amp; ReactPackage允许我在Android应用程序中设置值？

onPressLoginButton() {
    console.log("You tapped the button!");
    MyLogin.doLogin(this.state.username, this.state.password)
  }

更新

我的java代码如下所示： -

@ReactMethod
public void doLogin(String username, String password) {
    Log.v(LOG_TAG, "public void doLogin(String username, String password) {} username =" + username + " password = " + password);
    Log.v(LOG_TAG, "public void doLogin(String username, String password) {} mUsername =" + mUsername + " mPassword = " + mPassword);
    //doLogin(username, password);
}

在我的javascript中我有这个： -

var MyLogin  = NativeModules.MyLogin;

这是“最佳实践”方法，用于在react-native和Android之间进行通信？

Answer 1

需要知道在自定义本机模块上实现的方法，但假设您有一个名为Login的方法使用@ReactMethod注释调用该方法，然后从javascript调用该方法看起来像这样：

    @ReactMethod
    public void Login(String username,String password) {
      // Here what you trying to do
    if(username.equalsIgnoreCase(""))
    {
    // do this
        .....
    }
    }

并在javascript中

NativeModules.CustomModule.Login("user","pass");

不要忘记正确注册自定义模块

在Android

1 个答案: