20200616 - 前端业务项目的日常记录

1. vue在setTimeout内修改this失效的解决办法

使用function定义setTimeout时，this会优先指向window对象。
①第一种解决方案是必须在它的外层重新拿到当前对象this

let that = this

之后的this都用that代替即可

②第二种解决方案是使用ES6的箭头函数

setTimeOut(() => {
	//执行的代码
},1000)

使用箭头函数后，里面的this就只会指向用当前对象，此时这里的this和一般的this等价，即指向data()里的数据

2. span 文本内容超过宽度自动换行

<span>{{remark}}</span>

span{
    word-break:normal;
    display:block;
    white-space:pre-wrap;
    word-wrap:break-word;
    overflow:hidden;
    width:80%;
}

3. Promise报错 Expected the Promise rejection reason to be an Error：

Vue.prototype.$my_confirm = function (options) {
  return new Promise((resolve, reject) => { // promise封装，ok执行resolve，no执行rejectlet
    if (options === undefined || options === null) {
      options = {
        content: ''
      }
    } else if (typeof options === 'string' || typeof options === 'number') {
      options = {
        content: options
      }
    }
    var Confirm1 = Vue.extend(Confirm)
    var component = new Confirm1({
      data: options
    }).$mount()
    document.body.appendChild(component.$el)
    component.ok = function () {
      resolve()
    }
    component.close = function () {
      //reject() // 原本这里报错	
      reject(new Error())
    }
    Vue.nextTick(() => {
      component.visible = true
    })
  })
}

在promise的reject中需要传入的是一个Error对象.
因此将reject()改为reject(new Error())即可

---

Smile and let everyone know that today you’re a lot stronger than you were yesterday.
用微笑告诉世人，今天的你比昨天更加强大。