vue访问模板中的导入变量答案

【问题标题】：vue access imported variable in templatevue访问模板中的导入变量
【发布时间】：2018-05-31 06:43:05
【问题描述】：

是否有某种方法可以在模板中使用导入的对象，而无需在 vue 组件中为其指定别名/属性。 IE。我可以以某种方式使用未在“this”上定义的变量

 <template>
        <div v-if="Store.loaded"></div> //Store not defined on component
        <div v-if="store.loaded"></div> //works
    </template>

    <script>
        import Vue from 'vue'
        import { Component } from 'vue-property-decorator'
        import Store from "../store" // can I somehow use this directly?

        @Component
        export default class App extends Vue {
            store = Store // is there some way so I don't need this line?
        }
    </script>

【问题讨论】：

标签： vue.js vue-class-components

【解决方案1】：

我能否以某种方式使用未在“this”上定义的变量

据我所知这是不可能的。

但是，查看您的示例，我可以看到您正在尝试访问 Vuex 商店的属性。 Vuex 通过this.$store 在每个实例上公开存储，因此您应该能够在模板中执行此操作：

<div v-if="$store.state.loaded">

【讨论】：

不幸的是它不是一个 vuex 商店。这是我自己的 Store 对象。但也许我可以编写一个插件，像 vuex 那样将我的商店附加到 vue

【解决方案2】：

您可以使用插件，例如 vuex。但总的来说，这是一个坏主意。
它使其他使用您的代码的人质疑Store 字段的来源。

【讨论】：