项目开发中的一些问题（一）

1.接收res之后的容错处理

// 数据容错
.then((res) => {

// result是嵌套解构，所以要用两次解构赋值
// 如果用{ result: { list, totalCount } = result }, result就只会是一个标签，没有赋值
// result为防止它是null，可以先默认赋值为一个空对象{}
// 一般totalcount是数字，el-ui会自动判断，res是由axios-service发出的，一般是对象


        const { result = {}, msg } = res
        const { list, totalCount } = result


// 容错处理一般用嵌套来一步一步判断解决，像洋葱一层一层判断
// 然后判断方法尽量用es6的方法
// 一般msg的值都是正确的，与list的结构是相对应的，然后在判断结尾发送
// 如果msg为null或''的时候要用自定义的消息， msg || '刷新消息请求成功'
// 自定义的消息要和接口相一致，
// 有多少接口就做多少个容错处理

// 容错可以防止白屏，提升体验

// msg也要容错， 如果msg 是个 '' ，前端页面会是一个没有内容的 toast


        if (Array.isArray(list)) {
          this.tableData = list
        }
        if (Number.isInteger(totalCount)) {
          this.itemTotal = totalCount
        }
        this.$message.success(msg || `刷新请求成功`)
      })
      .catch(err => {
        this.$message.error(err.msg || '刷新响应错误')
      })
    }

2.利用...为对象添加属性

searchParmas = {
  page: 1,
  size: 10
}
searchParmasCopy = { range: 49, page: 14 }

searchParmas = {...searchParmas, ...searchParmasCopy}
console.log(searchParmas)

// { page: 14, size: 10, range: 49 }

Object.assign (searchParmas, { range: 49, page: 14})

// ...比assign要简洁

3.onclick

// 默认传的第一个参数是e

// jsx写法都是要用表达式

setTitle (e) {
    this.formdata.title = e
}

render () {

    <element
    on-input = { setTitle }
    ></element>

}

// 传参执行需要表达式启动

handlePage (page) {
  this.page = page
}

render () {

    <element
    on-input = { () => { handlePage(1) } }
    ></element>

}

// 下面写法会导致电脑进入死循环

render () {

    <element
    on-input = { handlePage(1) }
    ></element>

}

// 组件内多个参数传参，注意是组件的参数

handlePage (e1,e2,e3) {
  this.page = page
  // ...e1,e2,e3
}

render () {

    <element
    on-input = { (e1,e2,e3) => { handlePage() } }
    ></element>

}

// 除了组件参数，还有其他参数
handlePage (e1,page) {
  this.page = page
  // ...e1
}

render () {

    <element
    on-input = { (e1) => { handlePage(e1, this.page) } }
    ></element>

}

4. 用配置来设置判断参数

// 下面的'默认'可以通过data() {}里配置一个全局配置项来配置

if (this.formEditdata.isdefault === '默认') {

  // ...dosomething
}