两个textinput 切换不用点两下

核心代码

//添加手势监听

componentWillMount(){ 

          this._panResponder = PanResponder.create({ 

            onStartShouldSetPanResponder: () => true, 

            onPanResponderRelease: (evt,gs)=>{ 

              console.log(gs); 

             {/*处理事件*/} 

              if (gs.y0<46+38 && gs.y0>46) { 

                this.refs.textInputs.focus() 

              }; 

            } 

        }) 

  }

将手势监听给一个组件

{...this._panResponder.panHandlers}

将组建和事件写出来

ref='textInputs'

onFocus={() => {this.refs.textInputs.focus()}}

即可

🌰

/**

 * Sample React Native App

 * https://github.com/facebook/react-native

 * @flow

 */

import React, { Component } from 'react'; 

import { 

  AppRegistry, 

    StyleSheet, 

    View, 

    ScrollView, 

    PanResponder, 

    TextInput, 

    Text 

} from 'react-native'; 

export default class button extends Component { 

    constructor(props) { 

        //加载父类方法,不可省略 

        super(props); 

        //设置初始的状态 

        this.state = { 

          top:0, 

          left:0, 

        }; 

    } 

    componentWillMount(){ 

          this._panResponder = PanResponder.create({ 

            onStartShouldSetPanResponder: () => true, 

            onPanResponderRelease: (evt,gs)=>{ 

              console.log(gs); 

              if (gs.y0<46+38 && gs.y0>46) { 

                this.refs.textInputs.focus() 

              }; 

            } 

        }) 

    } 

    render(){ 

      return ( 



                      {...this._panResponder.panHandlers} 

                      keyboardShouldPersistTaps={false}> 



                        联系方式 







                            style={styles.telTextInput} 

                            autoCapitalize = "none" 

                            autoCorrect={false} 

                            multiline = {true} 

                            keyboardType = "default" 

                            ref='textInputs' 

                            placeholder = "请输入手机号或邮箱" 

                            placeholderTextColor = "#999" 

                            onFocus={() => {this.refs.textInputs.focus()}} 

                        > 





                            style={styles.telTextInput} 

                            autoCapitalize = "none" 

                            autoCorrect={false} 

                            multiline = {true} 

                            keyboardType = "default" 

                            ref='textInput' 

                            placeholder = "请输入手机号或邮箱" 

                            placeholderTextColor = "#999" 

                            onFocus={() => {this.refs.textInput.focus()}} 

                        > 







        ); 

    } 

} 

const styles = StyleSheet.create({ 

  container: { 

        flex:1, 

        flexDirection: 'column', 

        //marginTop:64, 

        backgroundColor:'white' 

    }, 

    line3:{ 

        height:46, 

        paddingHorizontal:15, 

        paddingVertical:15, 

        borderBottomColor:'#E0E0E0', 

        borderBottomWidth:1 

    }, 

    fdcontext:{ 

        color:'#aaa', 

        fontSize:14 

    }, 

    line5:{ 

        flexDirection: 'column', 

        flex:1, 

        height: 38*2, 

        borderBottomColor:'#E0E0E0', 

        borderBottomWidth:1, 

    }, 

    telTextInput:{ 

        height:37, 

        fontSize: 12, 

        color:'#aaa', 

        paddingHorizontal:15, 

        paddingVertical:6, 

    } 

}); 

AppRegistry.registerComponent('button', () => button);