Question

像标题一样，如果文本输入为空字符串，我想禁用设备键盘上的提交按钮（搜索）。我创建了一个搜索栏，并使用了TextInput。

我该怎么做？

Answer 1

您应该具有2个状态（textSearch和buttonStatus），并检查onChangeText道具中的每个TextInput

这是我使用的简单代码：

import React, {Component} from 'react';
import RN, {View, StyleSheet, Text} from 'react-native';

export default class History extends Component {

  constructor(props) {
    super(props);
    this.state={
      search:null,
      disabledButton:true
    }
  }

  render(){
    return(
      <View style={styles.container}>
        <RN.TextInput
          value={this.state.search}
          onChangeText={(e)=>{
            this.setState({search:e, disabledButton:e==""?true:false})
          }}
        />
        <RN.Button
          title="Search"
          disabled={this.state.disabledButton}
        />
      </View>
    )
  }
}

const styles = StyleSheet.create({
  container:{flex:1, justifyContent:'center', alignItems:'center'}
})

如果文本输入为空字符串，则React Native禁用设备上的提交键盘

1 个答案: