vue问题记录

watch监听对象多个属性变化后再执行事件

使用计算属性 避免触发多次

  computed: {
    cloneQueryParams(){
      return JSON.parse(JSON.stringify(this.queryParams))
    }
  },
  watch:{
    'cloneQueryParams': {
      handler(nv, ov){
       // do ..
      },
      deep: true
    }
  }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
computed: {
 	watchObj () {
        let { id, name } = this
        return { id, name }
    }
},
1
2
3
4
5
6

props的值不能直接改变

持用computed

 setup(props, {attrs, emit}){
    const localValue = computed({
      get(){
        return props.value
      },
      set(val){
        emit('input', val)
      }
    })
    return {
      localValue
    }
  },
1
2
3
4
5
6
7
8
9
10
11
12
13
Last Updated: 2021/12/16 03:02:57
Contributors: shangxin