Vue.js에서 v-for를 사용하여 개체의 어레이에 있는 항목에 액세스합니다.

Vue.js에서 v-for를 사용하여 개체의 어레이에 있는 항목에 액세스합니다.

v-for를 사용하여 각 예산에 대한 이름을 나열하려고 합니다.vuex getter를 사용하여 사용자와 관련된 예산에 액세스하지만 어레이의 각 개체를 반환합니다.어레이 내의 각 예산 이름에 액세스하려면 어떻게 해야 합니까?

여기에서는 예산 이름을 나열하려고 합니다.

                    <v-list-item
                    v-for="(budget, key, index) in $store.getters.getBudgets"
                    :key="index"
                >

vuex.js의 getter 함수는 다음과 같습니다.

        getBudgets: state => {
       return state.user.budgets;
    }

결과는 다음과 같습니다.다음과 같은 개체 목록입니다. {id:29, 이름:예산 1...} {id:35, 이름:예산2...}

어레이 오브젝트를 루프 오버하여budget.name루우프 내에 있습니다.예산 ID가 고유하고 그렇지 않다고 가정합니다.null인덱스를 사용할 필요가 없습니다.key그게 목적이라면요

<v-list-item v-for="budget in $store.getters.getBudgets" :key="budget.id">
   {{ budget.name }}
</v-list-item>

언급URL : https://stackoverflow.com/questions/69319652/access-item-in-an-array-in-object-using-v-for-in-vue-js