vue 서브어셈블리 데이터 수정 또는 호출 작업

<서브어셈블리ref='xxx'>
상위 어셈블리:
this.refs.xxx.서브어셈블리 정의 방법()
외부:
vm.$refs.xxx.서브어셈블리 정의 방법()
주의: 하위 구성 요소는ref 속성을 추가해야 부모 구성 요소는refs를 통해 얻을 수 있습니다.
보충 지식: vue는 데이터 값을 업데이트합니다. 구성 요소를 어떻게 다시 렌더링합니까?
1: 먼저 Vue를 소개합니다.set () 메서드
주: 서버에서 되돌아오는 데이터의 양이 비교적 적거나 몇 개의 필드만 있으면 vue의 set 방법을 사용할 수 있습니다. 데이터의 양이 비교적 크면 두 번째 상황을 직접 보십시오.
홈 API는 다음과 같이 설명합니다.
Vue.set(target,key,value)
매개변수:
{Object | Array} target
{string | number} key
{any} value
반환값: 설정된 새 값
사용법:
응답식 대상에 속성을 추가하고 이 새 속성이 응답식인지 확인하고 보기 업데이트를 터치합니다.이것은 응답식 대상에 새로운 속성을 추가하는 데 사용해야 합니다. 왜냐하면 Vue는 일반적인 새로운 속성을 탐지할 수 없기 때문입니다. (예:this.my Object.newProperty ='hi')
객체는 Vue 인스턴스 또는 Vue 인스턴스의 루트 데이터 객체가 될 수 없습니다.
나는 간단한 예를 들어 이런 용법을 소개한다.
1: 데이터에서 객체를 정의합니다.

data() {
 return {
  person:{
  age:10,
  name:' ',
  sex:1
  }
 }
}
2: 서버에서 새 데이터 객체로 돌아가기 요청:

person:{
 age:20,
 name:' ',
 sex:0
}
이때 이 대상을 실시간으로 페이지에 렌더링해야 한다
3: Vue로.set () 메서드 데이터 업데이트
다음과 같습니다.

methods: {
 getPerson(){
  this.$http({
  method: "post",
  url:this.$$baseURL + "sys/getPerson",
 }).then(res => {
  Vue.set(this.person,0,{age:res.data.age,name:res.data.name,sex:res.data.sex})
/**
* 0  0 
*
*/
});
}
}
이렇게 하면 서버에서 되돌아오는 새 데이터가 실시간으로 구성 요소에 업데이트됩니다.
다음은 두 번째 상황을 설명합니다.
이런 상황은 데이터의 양이 비교적 많고 필드가 비교적 많으며 Vue를 사용하는 것이다.set () 방법은 좀 지나치다. 이럴 때 우리는 어떻게 해야 합니까?
핵심 사상은 임시 변수를 정의하는 것이다. 컴퓨터는 계산 속성이기 때문에 이 안의 값은 구성 요소 업데이트 페이지를 실시간으로 렌더링할 수 있다.
1: 우리는 데이터에서 매우 큰 임시 대상을 정의한다

data() {
 return {
 myTempObj:{} //  , 
 }
}
2: 우리는 계산 속성에서도 매우 큰 대상을 정의한다
이 대상은 우리가 페이지에서 진정으로 사용한 대상이다

computed: {
 myObj: {
  get: function(){
  return this.myTempObj; //  
  }
 },
}
3: 비동기 요청을 시작하여 서버에서 데이터를 되돌려줍니다.

methods: {
 getBigObj(){
  this.$http({
  method: "post",
  url:this.$$baseURL + "sys/getBigObj",
 }).then(res => {
  this.myTempObj=res.bigObj ; //  
});
}
}
넷째: 페이지 템플릿 구성 요소에서 사용 방법

<div class="brand-list bybrand_list" v-for="(item, index) in myObj" :key="index">
 {{item.name}}
</div>
상기 두 가지 상황은 모두 서비스에서 얻은 데이터가 실시간으로 업데이트되지 않는 문제를 해결할 수 있으며 구체적인 상황에 따라 사용을 선택할 수 있습니다!여러분들께 참고가 되었으면 좋겠고 저희도 많이 응원해 주셨으면 좋겠습니다.

좋은 웹페이지 즐겨찾기