发布于

elementUI MessageBox prompt模式下异步提交问题

问题

最近写项目发现，使用elementUI的MessageBox的prompt 异步提交数据时，存在点了确定弹窗关闭并且不再执行then下面的指令，自然也就没办法继续执行。

经过一番测试，解决办法为：使用callback方法来代替Promise，示例代码如下

this.$prompt('请输入密码', '管理员登录', {
        confirmButtonText: '确定',
        inputPlaceholder: '密码必须包含大小写字母和数字的组合',
        cancelButtonText: '取消',
        inputPattern: /^(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,16}$/,
        inputErrorMessage: '密码格式不正确',
        callback: function (action, instance) {
          if (action === 'confirm') {
            self.$axios({
              url: self.$serverUrl + '/index/Server/RconLogin',
              method: 'POST',
              data: {你要提交的数据}
            }).then(function (res) {
              if (res.data.status === 'success') {
                self.$message({
                  type: 'success',
                  message: '成功进入管理员模式！'
                })
                self.ServerInfoDialog.adminMode = true
              }
            }).catch(function (error) {
              self.$message({
                type: 'danger',
                message: error.response.data
              })
            })
          }
        }
      })

这样就可以在窗口关闭之后继续执行回调内的代码了。请注意 instance.inputValue 的值就是prompt内输入的信息

发布于

Vue完美解决支付宝返回的form表单问题，这可能是最有效的解决办法了

该说的话写前面

SB支付宝，都TM9102年了，你还给我返form让我执行

由于写本文事作者非常生气，所以布局可能比较杂乱，但是请您一定看完，绝对有效！

网上的代码我都试了，要么是无法跳转，要么是跳转回当前页面（_blank之后还是当前页面）。

捉摸了几个小时之后，最终解决办法

let divForm = document.getElementsByTagName('divform')
            if (divForm.length) {
              document.body.removeChild(divForm[0])
            }
            const div = document.createElement('divform')
            div.innerHTML = res.data // res.data就是sb支付宝返回给你的form
            document.body.appendChild(div)
            // document.forms[0].setAttribute('target', '_blank') // 加了_blank可能出问题所以我注释了
            document.getElementById('alipay_submit').submit()

请用我的代码，绝对可以了。

老子集成微信用了不到10分钟，集成支付宝用了4个多小时。sb支付宝

发布于

几个不错的CSS按钮闪烁动画

@-webkit-keyframes bigAssButtonPulse {
      from { background-color: #749a02; -webkit-box-shadow: 0 0 25px #333; }
      50% { background-color: #91bd09; -webkit-box-shadow: 0 0 50px #91bd09; }
      to { background-color: #749a02; -webkit-box-shadow: 0 0 25px #333; }
    }

    @-webkit-keyframes greenPulse {
      from { background-color: #749a02; -webkit-box-shadow: 0 0 9px #333; }
      50% { background-color: #91bd09; -webkit-box-shadow: 0 0 18px #91bd09; }
      to { background-color: #749a02; -webkit-box-shadow: 0 0 9px #333; }
    }

    @-webkit-keyframes bluePulse {
      from { background-color: #007d9a; -webkit-box-shadow: 0 0 9px #333; }
      50% { background-color: #2daebf; -webkit-box-shadow: 0 0 18px #2daebf; }
      to { background-color: #007d9a; -webkit-box-shadow: 0 0 9px #333; }
    }

    @-webkit-keyframes redPulse {
      from { background-color: #bc330d; -webkit-box-shadow: 0 0 9px #333; }
      50% { background-color: #e33100; -webkit-box-shadow: 0 0 18px #e33100; }
      to { background-color: #bc330d; -webkit-box-shadow: 0 0 9px #333; }
    }

    @-webkit-keyframes magentaPulse {
      from { background-color: #630030; -webkit-box-shadow: 0 0 9px #333; }
      50% { background-color: #a9014b; -webkit-box-shadow: 0 0 18px #a9014b; }
      to { background-color: #630030; -webkit-box-shadow: 0 0 9px #333; }
    }

    @-webkit-keyframes orangePulse {
      from { background-color: #d45500; -webkit-box-shadow: 0 0 9px #333; }
      50% { background-color: #ff5c00; -webkit-box-shadow: 0 0 18px #ff5c00; }
      to { background-color: #d45500; -webkit-box-shadow: 0 0 9px #333; }
    }

    @-webkit-keyframes orangellowPulse {
      from { background-color: #fc9200; -webkit-box-shadow: 0 0 9px #333; }
      50% { background-color: #ffb515; -webkit-box-shadow: 0 0 18px #ffb515; }
      to { background-color: #fc9200; -webkit-box-shadow: 0 0 9px #333; }
    }

建议animation时间为2.5~3秒，比较有感觉