我有以下商店:
export const useMyStore = defineStore('myStore', {
state: () => {
return {
openTransOnly: false,
keyword: '',
openTransStatus: { nextPage: 0, complete: false },
pastDueTransStatus: { nextPage: 0, complete: false },
};
},
getters: {
transStatus(state) {
return state.openTransOnly ? state.openTransStatus : state.pastDueTransStatus;
},
},
});
现在假设我想将上面的“keyword”属性转换为 Ref。我是这样做的:
const myStore = useMyStore();
const { keyword: needle } = storeToRefs(myStore);
我的组件中还有以下计算属性:
const page = computed({
get: () => myStore.transStatus.nextPage,
set: (value) => (myStore.transStatus.nextPage = value),
});
效果很好。但是,我想知道如何使用上面相同的“storeToRefs”来定义“页面”。我试过这个:
const { keyword: needle, transStatus: { nextPage: page } } = storeToRefs(myStore);
但它说“页面未定义”。我究竟做错了什么?这可能吗?
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
正如
storeToRefs名称所示,它返回引用。transStatus是一个引用,没有nextPage属性,它是transStatus.value.nextPage。由于transStatus的工作方式以及该值是标量,过早解构nextPage会导致反应性丧失。如果这是常见的使用场景,商店可以合并
page计算。由于商店状态不应在商店外部发生变化,因此page可以与setPage操作结合使用。