AkiraZ's blog

现象

element-ui 下拉框选项改变后没有立即更新值，而是在下一个选项被选择之后，上一个选项的值才会被更新。查了资料最后确定应该是 Vue 的双向数据绑定上的问题，简单说就是如果直接更改对象，Vue 会对其中所有 key 进行监听，如果直接插入一个 key-value，则不会。

功能，在发出上一个请求还没返回的时候，为了防止有连续多个请求返回，对上一个未返回的请求执行取消操作。

底层是 axios 调用了 XMLHttpRequest 的 abort() 操作，取消上一条请求

XMLHttpRequest.abort() - Web API 接口参考 | MDN (mozilla.org)

代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

const cancel = null;

function request() {
    // 检查是否有 cancelToken，有就会执行
    // 背后的调用做过处理
    // 如果请求已经返回或者已经被取消就不会执行
    if (cancel) {
        cancel();
    }
    this.axios({
        method: 'get',
        url: '...',
        // 请求时配置，将 cancelToken 保存至一个全局变量，之后使用
        cancelToken: new this.axios.CancelToken(ct => {
            token = ct;
        })
    })
        .then(...)
        .catch(...);
}

比较容易理解

需求是遇到一个需要保留两位小数，但是出现了预期之外的结果

1
2

(15.845).toFixed(2);		// 15.85
(16.845).toFixed(2);		// 16.84

显然是不符合四舍五入规则的，最后的原因在官方文档中已写明，而且根本不是特殊的四舍五入规则的原因。

简单记个笔记

模态框的开启

使用 data-toggle 和 data-target 或 data-toggle 和 href 的组合

1

<button data-toggle="modal" data-target="#modal-id">按钮</button>

或者

由于最近的业务原因，又开始使用 jQuery，jQuery 的组件虽然丰富，但是感觉不太协调，各管各的，配置起来也比较麻烦，这里先说个遇到的问题

业务场景是这样的，需要在页面显示数量变更的时候自动切换到第一页，但是如果是默认的配置不会有这样的功能。

简介

GitHub 的自动化流水线，主要功能为

• 监听推送分支
• 自动构建并部署支 GitHub Pages
• 自动推送至 Gitee
• 将构建完成的内容也推送至 Gitee Pages

由于项目的原因，最近又开始用 ajax 了，遇到了一个问题就记个笔记。

关于传值

传值到底是传 formDara 还是 JSON 就不谈了，主要看后端需求

FormData 对象

Formdata 对象通常放在 post 请求的 data 位置，用来以表单形式提交数据，

1
2
3
4
5

$.ajax({
  url: "stash.php",
  type: "POST",
  data: fd,
});

了解了一下 FormData 对象的一些方法，做个记录

基础类型真假表

以上是六大基本类型，值得注意的是，其中 null 类型，如果使用 typeof，返回值是 "object"

几个默认的假值在判断的时候就可以简写，或者写成 !!varName 转。

一般的指向

概括地说，就是指向调用它的那个对象。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var f = function () {
  console.log(this.x);
}

var x = 1;
var obj = {
  f: f,
  x: 2,
};

// 单独执行
f() // 1

// obj 环境执行
obj.f() // 2

其中，f() 是在全局执行，所以返回全局的 x；obj.f() 在 obj 内部执行，所以返回 obj.x

1
2
3
4
5
6
7
8
9
10

var a = {
  p: 'Hello',
  b: {
    m: function() {
      console.log(this.p);
    }
  }
};

a.b.m() // undefined

m() 由 b 调用，所以返回 b.p undefined