【问题标题】:clearing all textInput field on submit react native在提交时清除所有 textInput 字段反应本机
【发布时间】:2021-01-25 09:12:50
【问题描述】:

我想清除按钮按下时的所有文本输入字段,而不是它抛出一个错误说 undefined 不是一个选项,因为试图从 value={this.state.inputTextValue} 中获取并清除输入 setState({ inputTextValue : ''})

const[username, setUsername] = useState("");
  const[mobile, setMobile] = useState("");
  
  const[ isSubmit, setIsSubmit] = useState(false);

  useEffect(() => {
    const order = async () => {
      axios
      .post(
        "*****************",
        JSON.stringify({
          username:username,
          mobile: mobile,
        })
      )
      .then((response) => {
        console.log(response.data);
        setIsSubmit(false);
      })
      .catch((err) => {
        console.log(err);
      });
    };

    if (isSubmit) order();
  }, [isSubmit]);

   const orderHandler = (text) => {
       setUsername(text);     
  };  

在此处清除 TEXTINPUT ONPRESS 值

   const handleSubmitEdit = () => {
     
    setState({inputTextValue : ''})
  };
  

 return (
         <ScrollView contentContainerStyle={{flexGrow: 1}}
                keyboardShouldPersistTaps='handled'
              >
          
                  <View style={styles.formwrap}>
                  
                  <Form style={styles.mainform}>
                  <View style={styles.formgroup}> 
              <SafeAreaView>


                      <View style={styles.formItems}>

这里取值={value={this.state.inputTextValue}}

                        <TextInput placeholder="Full Name"
                        onChangeText={orderHandler}
                        value={this.state.inputTextValue}
                        />
                      </View>
                      <View style={styles.formItems}>
                        <TextInput  placeholder="Mobile" 
                        style={styles.input}
                        keyboardType={"phone-pad"}
                        onChangeText={(text) => setMobile(text)}
                        value={this.state.inputTextValue}
                        />
                      </View>
                      <View style={styles.buttonContainer}>
                      <TouchableOpacity
                        style={styles.submit}
                        onPress={() => {setIsSubmit(true),handleSubmitEdit()}}'>
                        <Text style={[styles.submitText]}>ORDER</Text>
                      </TouchableOpacity>                              
                  </View>
                  </SafeAreaView>                                            
                 </View>     
                  </Form>                      
                  </View>    
           </ScrollView>   
 )
};

【问题讨论】:

    标签: javascript android ios node.js react-native


    【解决方案1】:

    你得到什么错误?从 React 16 开始,您现在应该使用函数式组件。对于管理,我认为阅读三元运算符更明智。使用状态运算符时,您应该使用带有 USESTATE 运算符状态的 SETTING。请记住,道具仅在状态更改和道具更改时才会呈现。

    常量 [foo, setFoo] = useState('')

    useEffect(() => { 试试{

    const order = async () => { 常量数据 = 等待 axios 。邮政( "******************", JSON.stringify({ 用户名:foo }) [])

    };
    

    }捕捉(错误){

    控制台日志(错误)

    }

    【讨论】:

    • Actullay 我想在按下提交按钮后清除文本输入字段mrest一切正常
    猜你喜欢
    • 1970-01-01
    • 2020-09-03
    • 2022-01-08
    • 1970-01-01
    • 2023-03-09
    • 2020-11-11
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多