如何从模块访问可组合状态？

Question

我正在尝试将 number 的状态值从一个商店传递到另一个商店，为什么它不起作用？获取号码未定义。

import {
  reactive,
  toRefs
} from 'vue';
  
const state = reactive({
  number: 12
})

export function test() {
  
  return {
    ...toRefs(state)
  }
}

对此：

import {
  reactive,
  toRefs,
} from 'vue';

import { test } from '@/myvuex/somestore';

const state = reactive({
  testValue: 5
})

export function useGlobal() {

  console.log(number)

  return {
    ...toRefs(state),
    test,
    number
  }
}

Answer 1

test 导入是一个函数，所以必须调用它。它 returns 一个包含第一个模块 state.

的引用的对象

然后就可以传对象的number 属性:

const importedState = test();         // retrieving the state from module #1
const number = importedState.number;  // the `number` ref
    
export function useGlobal() {
  console.log(number.value);          // It's a ref now, use `.value`
      
  return {
    ...toRefs(state),
    test,
    number
  }
}

如何从模块访问可组合状态？

How do I access composable state from a module?

javascript

vue.js

es6-modules

vuejs3

vue-composition-api