Javascript 在更改值之前,如何使交换机组件异步等待成功响应?

Javascript 在更改值之前,如何使交换机组件异步等待成功响应?,javascript,react-native,Javascript,React Native,开关的默认流量将在按下时立即切换该值 我想执行以下逻辑 按下开关 暂时不要更改该值 打开警报框 如果确定,则发送post请求以切换数据库值 成功响应后,允许更改开关值 我可以获得成功的响应并更新开关,但只要按下开关,值就会切换两次,我想暂停此行为,直到有成功的响应。尝试异步等待,尝试在无反馈的触摸屏中包装开关。。。现在需要帮助吗 <Switch value={this._getSwitchValue(id)} onValueChange={() => this._to

开关的默认流量将在按下时立即切换该值

我想执行以下逻辑

  • 按下开关
  • 暂时不要更改该值
  • 打开警报框
  • 如果确定,则发送post请求以切换数据库值
  • 成功响应后,允许更改开关值
  • 我可以获得成功的响应并更新开关,但只要按下开关,值就会切换两次,我想暂停此行为,直到有成功的响应。尝试异步等待,尝试在无反馈的触摸屏中包装开关。。。现在需要帮助吗

    <Switch 
       value={this._getSwitchValue(id)} 
       onValueChange={() => this._toggleSwitch(id)}
    />
    
      /**
       * Toggle the Switch - Send post request to database
       */
      _toggleSwitch (id) {
        Alert.alert('Notice!', 'Do you really want to change this setting?',
        [
          { text: "OK", onPress: () => this.props.toggleSettingsSwitch(id, this.props.token) },
          { text: "Cancel", onPress: () => console.log("cancel pressed")}
        ],
        { cancelable: true }
      )}
    
    this.\u toggleSwitch(id)}
    />
    /**
    *切换开关-向数据库发送post请求
    */
    _切换开关(id){
    Alert.Alert('Notice!','是否确实要更改此设置?',
    [
    {文本:“OK”,按:()=>this.props.toggleSettingsSwitch(id,this.props.token)},
    {文本:“取消”,onPress:()=>console.log(“取消按下”)}
    ],
    {可取消:true}
    )}
    
    更改发出请求的函数中的
    开关值

    toggleSettingsSwitch = async (value) => {
    
      const response = await this.changeSettingsRequest(); // making a call
    
      // here add a check, if request was successful change switch value
      // if (response.ok) {
      // this.setState({ switchValue: value });
      //}
    
    };
    
    _toggleSwitch = (value) => {
      Alert.alert(
        'Notice!',
        'Do you really want to change this setting?',
        [
          {
            text: 'OK',
            onPress: () => {
              this.toggleSettingsSwitch(value);
            },
          },
          { text: 'Cancel', onPress: () => console.log('cancel pressed') },
        ],
        { cancelable: true }
      );
    };
    
    <Switch
      onValueChange={this._toggleSwitch}
      value={this.state.switchValue}/>
    
    toggleSettingsSwitch=async(值)=>{
    const response=wait this.changeSettingsRequest();//进行调用
    //这里添加一个检查,如果请求成功,则更改开关值
    //if(response.ok){
    //this.setState({switchValue:value});
    //}
    };
    _toggleSwitch=(值)=>{
    警惕,警惕(
    “注意!”,
    '是否确实要更改此设置?',
    [
    {
    文本:“OK”,
    onPress:()=>{
    此.切换设置开关(值);
    },
    },
    {text:'Cancel',onPress:()=>console.log('Cancel pressed')},
    ],
    {可取消:true}
    );
    };
    

    谢谢,但这个零食的例子也有同样的问题。按下开关时仍会执行该开关。另外值得注意的是,我可以处理设置页面上的多个开关,我需要传递ID paramYes,这是一个基于您需要的示例更改它,我在我的答案中添加了注释以指导您。谢谢,但零食示例中的问题仍然存在。只要按下开关,它就会打开然后关闭。我希望开关保持设置,直到值实际发生变化。你是说按下后会出现小动画?这是
    开关的实际行为
    您无法更改它。开关甚至没有打开,因为值没有更改,所以开关保持关闭状态。您看到的是按下按钮时的动画,单击开关时会出现该动画。