簡體   English   中英

清除提交時的所有 textInput 字段 react native

[英]clearing all textInput field on submit react native

我想清除按鈕按下時的所有文本輸入字段,而不是它拋出一個錯誤,說未定義不是一個選項,因為試圖從中獲取 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>   
 )
};

你得到的錯誤是什么? 你現在應該因為 React 16 使用功能組件。 對於管理人員,我認為閱讀三元運算符更明智。 使用 state 運算符時,應將 SETTING 與 USESTATE 運算符 state 結合使用。 請記住,道具只會在 state 變化和道具變化時呈現。

Const [foo, setFoo] = useState('')

useEffect(() => { 嘗試{

const order = async () => { const data = await axios.post( "******************", JSON.stringify({ username:foo }) [] )

};

}趕上(錯誤){

控制台日志(錯誤)

}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM