首页 > 解决方案 > 在 vue3 组合 API 中使用来自 vuex 存储的嵌套值的正确方法

问题描述

切换到 vue3 组合 API 我不确定我是否在组件中正确使用了来自 vuex 的嵌套值。虽然一切似乎都运行良好,但它“感觉”并不是 100% 正确。


// Example value in Store

customer: { 
    name: '',
    address: ''

}

组件中的引用


// component

<template>
    <div>
       Enter your name <q-input v-model="customer.name" />
       Enter your address <q-input v-model="customer.address" />

    </div>
</template>


<script>
    import {ref, computed} from 'vue'
    import {useStore} from 'vuex'

    export default {

        setup(){
            const store = useStore()

            const customerStore = computed(() => {store.state.customer})
            const customer = ref(customerStore.value)

            export default(
                customer

            )
        }
    }
</script>

对于任何有关实现此目标的更好方法的反馈,我将非常高兴。

标签: vuexvuejs3vue-composition-api

解决方案


推荐阅读