技术问题总结

一.数组类

  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' ? (
                启用
              ) : (
                禁用
              )
            }
  1. 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)
            }
}

  1. 如何计算出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` 之类的错误。

你可能感兴趣的:(技术问题总结)