二十年九月记

对于在模板字符串中遍历的遍历的数据转数组数据为空的情况

 <span v-for="(it, ind) in (item.label||'').split(',')" :key="ind">{{
                  it
                }}</span>

实现对页面上某些对象文本信息的控制，禁止鼠标在当前元素上拖动.

 <span id="vs-text" class="vs-text" ondrag="return false">${unsuccessTip}</span>

解决本地和线上环境的路径不同的问题

window.location.replace无论前面的路径是什么只替换后面的文件路径名

 let url = '/h5Login.html?id='+ this.topicId
      window.location.replace(url)

js的导出方式

export {login}~~~~

export default login

export const login =(()=>{})

module.exports = login

Object.is

Object.is()方法判断两个值是否是相同的值
Object.is() 判断两个值是否相同。如果下列任何一项成立，则两个值相同：

• 两个值都是 undefined
• 两个值都是 null
• 两个值都是 true 或者都是 false
• 两个值是由相同个数的字符按照相同的顺序组成的字符串
• 两个值指向同一个对象

• 两个值都是数字并且

  • 都是正零 +0
  • 都是负零 -0
  • 都是 NaN
  • 都是除零和 NaN 外的其它同一个数字

这种相等性判断逻辑和传统的 == 运算符所用的不同，== 运算符会对它两边的操作数做隐式类型转换（如果它们类型不同），然后才进行相等性比较，（所以才会有类似 "" == false 为 true 的现象），但 Object.is 不会做这种类型转换。

这与===运算符也不一样。===运算符（和==运算符）将数字值-0和+0视为相等，并认为Number.NaN不等于NaN。

insertAdjacentHTML

「insertAdjacentHTML()」 方法将指定的文本解析为 Element 元素，并将结果节点插入到DOM树中的指定位置。它不会重新解析它正在使用的元素，因此它不会破坏元素内的现有元素。这避免了额外的序列化步骤，使其比直接使用innerHTML操作更快。

使用 insertAdjacentHTML 插入用户输入的HTML内容的时候，需要转义之后才能使用。
例如：
const one = document.getElementById('one');
// 由于 encodeURI('<div id="two">我是two</div>')会被转译为：
// %3Cdiv%20id=%22two%22%3E%E6%88%91%E6%98%AFtwo%3C/div%3E
// 因此最终会被当成 "%3Cdiv%20id=%22two%22%3E%E6%88%91%E6%98%AFtwo%3C/div%3E"字符串渲染
one.insertAdjacentHTML('afterend', encodeURI('<div id="two">我是two</div>'));
复制代码
如果只是为了插入文本内容（而不是HTML节点），不建议使用这个方法，建议使用node.textContent 或者 node.insertAdjacentText()。因为这样不需要经过HTML解释器的转换，性能会好一点。(这里是引用的MDN-insertAdjacentHTML上的内容)

insertAdjacentHTML和insertAdjacentElement的区别
第二个参数的类型不同， 前者接收的是是要被解析为HTML或XML元素的字符串，而后者接收的是一个element元素。
const one = document.getElementById('one');
one.insertAdjacentHTML('afterend', '<div id="two">我是two</div>');

const one = document.getElementById('one');
const two = document.createElement('div')
two.innerHTML = '我是two';
one.insertAdjacentElement('afterend', two);

will-change

常用的语法主要有：

• whil-change: scroll-position; 即将开始滚动
• will-change: contents; 内容要动画或者变化了
• will-transform; transform相关的属性要变化了(常用)

注意：

• will-change虽然可以开启加速，但是一定要适度使用
• 开启加速的代价为手机的耗电量会增加
• 使用时遵循最小化影响原则，可以对伪元素开启加速，独立渲染
• 可以写在伪类中，例如hover中，这样移出元素的时候就会自动remove掉will-change了
• 如果使用JS添加了will-change，注意要及时remove掉，方式就是style.willChange = 'auto'

链接：https://juejin.im/post/5ef293...

在当前页面未登录的情况下，跳转到登录可带上参数

关于前端请求一次，会请求接口两次的情况

我所知的一种情况就是
(但是类型不同)
这是个post请求
可能改了请求头了,请求头里面加了东西
一个复杂的post请求是有两次请求的
第一次是option 先经由服务器去做校验
对你这个请求的合法性先产生同意，告诉你你可以请求
这时候浏览器才会放行。让你发送真正的请求