vue sync 函式同步執行 待請求確認

<template>
  <div class="container">
      <confirm v-model="show"
      :title="title"
      @on-cancel="onCancel"
      @on-confirm="onConfirm"
      @on-show="onShow"
      @on-hide="onHide">
        <p style="text-align:center;">Are you sure?</p>
      </confirm>

      <button @click="test">test</button>
      <button @click="test2">test2</button>
  </div>
</template>
<script type="text/ecmascript-6">
import { Confirm } from "vux";
let RESPOND = { response: false };
export default {
  name: "",
  components: { Confirm },
  data() {
    return {
      show: false,
      title: "title",
      confirmTimestamp: 0
    };
  },
  computed: {},
  created() {},
  methods: {
    async test() {
      let a = await this.confirm();
      console.log('test :', a);
    },
    async test2() {
      let a = await this.confirm();

       console.log('test2 :', a);
    },
    onCancel() {
      console.log("onCancel");
      // RESPOND.response = false;
    },
    onConfirm() {
      console.log("onConfirm");
      RESPOND.response = true;
    },
    onShow() {
      console.log("onShow");
    },
    onHide() {
      console.log("onHide");
    },
    confirm() {
      this.show = true;
      RESPOND.response = false;
      let timestamp = new Date().getTime();
      this.confirmTimestamp = timestamp;
      let that = this;
      return new Promise(resolve => {
        //  RESPOND = new Proxy(
        //     {},
        //     {
        //       get: function(target, key, receiver) {
        //         // console.log(`getting ${key}!`);
        //         return Reflect.get(target, key, receiver);
        //       },
        //       set: function(target, key, value, receiver) {

        //         setTimeout(resolve(that.confirmTimestamp===timestamp?value:false), 10);
        //         return Reflect.set(target, key, value, receiver);
        //       }
        //     }
        //   );
        Object.defineProperty(RESPOND, "response", {
          get: function() {
            console.log("get方法獲取值");
          },
          set: function(val) {
            setTimeout(
              resolve(val),
              10
            );
          }
        });
      });
    }
  },
  watch: {}
};
</script>

<style lang="less" scoped>
</style>

複製程式碼