vue 수신 불가 그룹 및 대상 속성의 변화 문제 해결

1. 배열
1. 감청할 수 있는 상황
예를 들어push,splice,=부여(array=[1,2,3])
2. 감청할 수 없는 상황
아래 첨자를 사용하여 요소를 수정합니다.
array[index] = 1
object.a = 3
그룹 length 직접 수정
array.length = 5
3. 솔루션

this.$set(array, index, data) -  , , 
this.dataArr = this.originArr
this.$set(this.dataArr, 0, {data: ' '})
console.log(this.dataArr)    
console.log(this.originArr)    //     
위에서 언급한 splice 방법을 삭제 수정하다
임시 변수를 이용하여 중전하다

let tempArr = [...this.targetArr]
tempArr[0] = {data: 'test'}
this.targetArr = tempArr
대상
대상과 수조는 모두 js의 인용 유형이다. 실제 저장소에서 데이터는 무더기에 저장된다. 창고에 저장된 대상명이나 수조명의 바늘을 이용하여 색인을 한다. 따라서 얕은 복사와 깊은 복사, 등호 부여 값이 있을 때 도대체 하나의 바늘이 같은 데이터를 가리키는 것이냐, 아니면 두 바늘이 각각 똑같은 데이터를 가리키는 것이냐의 문제도 존재한다.
1. 감청할 수 있는
객체의 직접 = 할당
this.obj = {name: 'test'}
2. 감청할 수 없는
대상 속성의 삭제

obj: {
  prop1: 'data1',
  prop2: 'data2'
}
...
//  
this.obj.prop3 = 'data3'
//  
delete this.obj.prop1
//  
this.obj.prop1 = 'data4'
3. 해결 방법

this.$set(obj, key ,value) -  、 
watch deep:true , , 、 
this.$watch('blog', this.getCatalog, {
  deep: true
  // immediate: true //  
 });
watch key
watch: {
 'obj.name'(curVal, oldVal) {
  // TODO
 }
}
object.assign()+ = 
this.watchObj = Object.assign({}, this.watchObj, {
 name: 'xiaoyue',
 age: 15,
});
보충 지식: vue가 수조나 대상 값의 변화를 감청하지 못하면 어떻게 합니까
1. vue 감청 수조의 변화
vue는 수조의 변화를 감청하는 장면을 구입할 수 있다
값을 부여하는 형식으로 감청 중인 그룹을 바꾸기;
splice(index,num,val)의 형식으로 감청 중인 그룹을 변경합니다.
수조의push 형식을 통해 감청 중인 수조를 변경합니다.
vue는 그룹 변화의 장면을 감청할 수 없습니다
그룹 인덱스를 통해 그룹 요소의 값을 변경합니다.
수조의 길이 바꾸기;
vue는 그룹 변화의 장면을 감청할 수 없습니다
this.$set(arr, index, newVal);
splice(index,num,val)를 통해;
임시 변수를 중전으로 사용하여 값 그룹을 다시 부여합니다.
2. vue 감청 대상의 변화
vue는 대상이 변화하는 장면을 감청할 수 있다
직접 값을 부여하는 장면을 통해.
eg:watchObj = {name:“zyk”}
vue는 대상이 변하는 장면을 감청할 수 없습니다
대상의 증가, 삭제, 수정은 vue에서 감청할 수 없습니다
vue 감청할 수 없는 대상의 변화를 해결하는 방법
this.$사용set (object, key,value) (vue는this.set에서 기존 속성을 수정하는 것을 감청할 수 없습니다)
Object를 사용합니다.assign (), 직접 값을 부여하는 원리;(사용 권장)
이상의 vue가 수조와 대상의 속성을 정탐할 수 없는 변화 문제를 해결하는 것은 바로 편집자가 여러분에게 공유한 모든 내용입니다. 여러분께 참고가 되고 저희를 많이 사랑해 주시기 바랍니다.

좋은 웹페이지 즐겨찾기