programing

v-for 구성 요소가 실시간으로 업데이트되지 않음

goodsources 2022. 8. 28. 09:59
반응형

v-for 구성 요소가 실시간으로 업데이트되지 않음

상위 컴포넌트가 있습니다.DataVuex에서 상태를 가져옵니다. 이 상태를 사용하여 하위 구성 요소를 생성합니다.TableVuex 데이터 중 일부를 소품으로 전달합니다. 이 모든 것이 컴퓨터 안에 있습니다.v-for.

<template>
  <table v-for="(item,index) in data"
  :key="index + item.id"
  :propX="item.x"
  :propY="item.y"
  />
</template>
<script>
  name: "Data",
  components: {
   Table
  },
  computed:{
    data(){
    return this.$store.state.data;  
   }
  }
</script>

나의Table컴포넌트도 Vuex 상태를 변환합니다.또한 Vuex 상태가 정상적으로 변환되는 것을 알 수 있습니다.Data컴포넌트(vue dev tool)를 사용해도 데이터 컴포넌트는 my components의 소품을 업데이트하지 않습니다.Table구성 요소들.

몇 가지 문제가 있습니다.

  1. 컴포넌트 및 계산된 값에 예약된 이름 사용 안 함(사용 안 함table)
  2. 상태가 객체의 배열 또는 중첩 객체의 경우 반응하지 않을 수 있습니다.오브젝트/어레이를 재할당하거나set반응하는 방법을 찾아야 합니다.

몇 가지 예

// update objects
this.$set(this.$store.state.data, 'a', 1)
Vue.set(this.$store.state.data, 'a', 1)
this.$store.state.data = Object.assign({}, oldObject, { a: 1 })

//update array of objects
this.$store.state.data = [...data, newObject]

언급URL : https://stackoverflow.com/questions/69794900/v-for-components-dont-update-in-real-time

반응형