2

我有一个 Vue 应用程序。我用vuex。我这样创建了我的应用程序：

import { createApp } from "vue";
import axios from "axios";
import App from "./App.vue";
import router from "./router";
import store from "./store/index";

axios.defaults.baseURL = "https://localhost:44349";

const app = createApp(App)
  .use(router)
  .use(store)
  .mount("#app");

比我的组件之一我试图在 setup() 方法中访问 c​​ontext.root.$store ，但 context.root 是未定义的。

<script>
import {ref, computed } from "vue";

export default {
  name: "ClientList",

  setup(props, context) {
    
    const clients = ref([]);

    console.log(context);

    const clientOrdersLenght = computed(() => {
      return clients.value.length;
    });


    return { clients, clientOrdersLenght }
  },
  
};
</script>

我的想法是通过 context.root 访问我的商店。我用这个观看了视频和示例。但他们使用 'vue/composition-api' 将 Vue 2 称为导入。

我错过了什么？

4

2 回答 2

0

您也许可以直接包含和访问商店

store.dispatch('myModule/myModuleAction') store.myModule.state.blabla

import {ref, computed } from "vue";
import store from './store/index'; // include store

export default {
  name: "ClientList",

  setup(props) {
    
    const clients = ref([]);

    const clientOrdersLength = computed(() => {
      store.dispatch('myAction'); // call dispatch
      store.state.myItem // or access store's state
      return clients.value.length;
    });

    return { clients, clientOrdersLength }
  },
  
};
于 2020-08-19T18:03:04.403 回答
-1

我找到了一种从 vuex 使用 getStore() 访问我的商店的简单方法。这很酷。但由于功能中的其他原因，我或其他人将需要访问应用程序的 $root（vue 实例）。所以现在可能正确的问题是如何在子组件中获取应用程序的 $root （vue 实例）？

于 2020-08-20T07:54:37.747 回答