javascript - 如何在 React Native 中提交值后关闭弹出窗口?

标签 javascript reactjs react-native popup jsx

我正在使用 react-native-popup-dialog。弹出窗口中只有一个按钮(yes)。我想同时关闭按钮,我想将值提交给服务器。现在单击 yes 按钮后,值将提交给服务器。如何在同一个 onPress 方法中编写关闭函数?以下是我的代码

onPressYes = (workType) => {
            AsyncStorage.getItem('userid').then((usid) =>{
          this.setState({
            'userid': usid
          });
          console.log(usid);
         fetch(GLOBAL.USER_REQUEST,{
           method:'POST',
           headers:{
             'Accept': 'application/json',
             'Content-Type': 'application/json',

           },
           body:  JSON.stringify({
            workType,
            usid
             })
         })
         .then(response => response.json())
         .then((responseData) => {
           this.setState({
           data:responseData
         });
         });
            })
     }

popUpDialog = (id, workType) => {
           this.setState ({
            workType: workType
         });
         this.popupDialog.show();

       }
render(){
  return(
      <PopupDialog ref={popupDialog => {
                           this.popupDialog = popupDialog;
                         }}
                        dialogStyle={{ backgroundColor: "#FFFFFF", height: 180, width:300, borderWidth:1,padding:10}}
                        overlayBackgroundColor="#fff"  onDismissed={() => {
  }}>
                          <View style={styles.dialogContentView}>
                            <Text style={{fontSize:18, margingTop:10,color:"#000000"}}>Are you sure you want to submit?</Text>
                            <View style={{alignSelf:'center'}}>

                              <View style={styles.button_1}>
                                <Button title="Yes" color="#8470ff" onPress={() => this.onPressYes(workType)}/>
                              </View>
);

最佳答案

根据你的代码,你可以使用this.popupDialog.dismiss()实例方法来隐藏一个对话框:

onPressYes = (workType) => {
    this.popupDialog.dismiss(); // action to close a dialog

    AsyncStorage.getItem('userid').then((usid) =>{
    this.setState({
      'userid': usid
    });
    console.log(usid);
    fetch(GLOBAL.USER_REQUEST,{
      method:'POST',
      headers:{
        'Accept': 'application/json',
        'Content-Type': 'application/json',

      },
      body:  JSON.stringify({
      workType,
      usid
        })
    })
    .then(response => response.json())
    .then((responseData) => {
      this.setState({
      data:responseData
    });
    });
      })
}

关于javascript - 如何在 React Native 中提交值后关闭弹出窗口?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53184347/

相关文章:

javascript - 如果在该 div 中选择了所有子复选框,则选中/取消选中(全选复选框)

javascript - browser.switchTo().alert() 在 Protractor 中不起作用

node.js - 我遇到了这个错误!本地运行 npm start 时出现代码 ELIFECYCLE 错误?

reactjs - 带导航功能的switchNavigator 5

javascript - 一致的图形绘制

javascript - 在 props Griddle 自定义组件中传递函数 - ReactJS

javascript - ES6 ReactJS 警告 : React. createElement : type should not be null, 未定义、 bool 值或数字

xcode - 如何解决错误 'app' 的配置设置冲突。 "app"已自动签名,

android - Firebase 远程配置和 Microsoft Codepush 之间的区别

javascript - 返回句子中最大单词的长度