3.8.3 单决议

本篇文章主要记录学习心得，给自己看的就随便写写，粘贴一下代码，如果有小伙伴好奇如何访问本地服务器获取数据，可以给我留言，看到了都会回复，以后有时间可能会另外写一篇如何获取本地数据的博客

关于这个小节，书中有段例子如下

    var p = new Promise(function (resolve, reject) {
      click('#mybtn', resolve);
    });
    p.then(function (evt) {
      var btnID = evt.currentTarget.id;
      return request('http://some.url.1/?id=' + btnID);
    }).then(function (text) {
      console.log(text);
    });

并没有给出完整代码，在这里改写一下，通过请求我本地服务器，获取返回数据

例子1、单决议特性，这样绑定，按钮只可以点击一次

    // click(..)把"click"事件绑定到一个DOM元素
    // request(..)是前面定义的支持Promise的Ajax
    function click(id, state) {
      const btn = document.getElementById(id);
      btn.addEventListener(
        'click',
        (evt) => {
          return state(evt);
        },
        false
      );
    }
    var p = new Promise(function (resolve, reject) {
      click('mybtn', resolve);
    });
    p.then(function (evt) {
      var btnID = evt.currentTarget.id;
      return axios.get(`${baseUrl}/test?btnId=${btnID}`);
    }).then(function (res) {
      console.log(res.data);
    });

例子2、通过改写，可多次点击按钮，但是现实中一般不会用到，所以书中只用于教学

 function click(id, fun) {
      const btn = document.getElementById(id);
      btn.addEventListener(
        'click',
        (evt) => {
          fun(evt);
        },
        false
      );
    }
    var p = new Promise(function (resolve, reject) {
      click('mybtn', function (evt) {
        var btnID = evt.currentTarget.id;
        axios
          .get(`${baseUrl}/test?btnId=${btnID}`)
          .then(function (res) {
            console.log(res.data);
          });
      });
    });