技术问题总结

一.数组类

1. 怎么将数据组arr[1,2,3] ,arr1[1,2,3,4] 对比提取出4

解答：

var num = arr1.find( item => {
  return !arr.includes(item)
});
num = 4;

---

二.Vue + element-ui类

1. Vue配合element-ui中过滤数据 返回html代码的操作

代码如下：

formatter: (row, column, cellValue, index) => {
              return cellValue == 'enable' ? (
                <span style="color:#3267e6">启用</span>
              ) : (
                <span style="color:#e65252">禁用</span>
              )
            }

2. Vue中的增删改查 调用的表单这个时候我们一般可以封装系统的业务逻辑

代码如下：

 extraButtons:[
 {
          type: 'primary',
          text: '编辑',
          atClick: row => {
            this.extraButtonsHandle(row, '编辑业务')
            return Promise.resolve(false)
          }
        },
        {
          text: '查看',
          atClick: row => {
            this.extraButtonsHandle(row, '查看业务', true)
            return Promise.resolve(false)
          }
        }
]

封装的函数代码如下:

methods:{
   extraButtonsHandle(row, title, isDetail) {
      this.delItem = row
      this.dialogVisible = true
      //点击不同的按钮标题就会不同因为传入的值不同
      this.dialogTitle = title
      //当点击查看看的时候就会 隐藏表单的确定按钮 ，因为编辑按钮没有传入值isDetail是undenfind 隐式转换false
      this.isDetail = isDetail
      this.$nextTick(() => {
        this.$refs.dialogForm.updateForm({
          //解构数据源
          ...row,
          //数据源中的字段和渲染页面的字段不匹配 所以重新返回定义字段(我们只需要值)
          paySysAccessAuthCode: row.paySysAccessAuth.code,
          payApplicationCode: row.payApplication.code
        })
      })


}

---

三.esa6 新语法

• 解构对象里面的键

代码：

const {a,b,c} = {a:1 , b:2 ,c:3 ,arr:['money']}
console.log(a) // a = 1
console.log(b) // b = 2
console.log(c)  // c = 3
console.log(arr)  // arr = 'money'
//对象中的解构只要对应键，就能拿到 

• 解构数组中的值

代码：

const{a,b,c} = [4,5,6]
console.log(a) // a = 4
console.log(b) // b = 5
console.log(c)  // c = 6
//如果需要单独解构其中的一个也是需要对应位置的(数组的解构需要对应位置)
const{,,c} = [4,5,6]
console.log(c)  // c = 6

• async await 的用法 配合着请求的封装
  async放在函数名前，用来定义函数，在定义的函数中使用await 后边跟着promise对象，这样就会接受到成功时的回调resolve(res) 里面res的值
  • 首先封装请求函数(函数返回的是promise对象)
  • 代码：request.js

    //先将函数暴漏出去   p是函数名
    export function p('请求地址'){
      return new Promise((resolve,reject) => {
                //这里将用axios请求资源模块去请求处理，
                this.$axios.get('请求地址').then(res => {
                       resolve(res) 
                })
          })
  
    }
  

  • 在vue中的methods 中定义一个函数(async)
  • 代码：index.js

  import {p} from request.js
  methods:{
  async getDate(){
           //这里的result  就是 上边p函数中的resolve中的res ，
       let result = await p('请求地址')
  
     }
     //这里将的就是一个使用场景
     //优化我们还可以 用try catch来组成作用域
  
    }
  

---

四.算法类

1. 如何计算出1+2+3+。。。+n 用你最熟悉的语言方式

代码：

//递归算法   p是函数的名称
function p(x){
    if(x < 2){
        return 1
  }else {
    return x+ p(x-1)
            }
}

2. 如何计算出1/2+1/3+。。。。+1/n

代码:

//递归算法 p是函数的名称
function p(x){
  if(x < 2){
    return 0
  }else{
    return 1/x +p(x-1)
  }

}

五 Vue报错点

错误操作:

不要在选项属性或回调上使用比如 `created: () => console.log(this.a)` 或
 `vm.$watch('a', newValue => this.myMethod())`。
因为箭头函数是和父级上下文绑定在一起的，
`this` 不会是如你所预期的 Vue 实例，
经常导致 `Uncaught TypeError: Cannot read property of undefined` 或 `
Uncaught TypeError: this.myMethod is not a function` 之类的错误。