Javascript 通过脚本标记包含Vuex.js时出现Vuex mapState引用错误_Javascript_Vue.js_Vuejs2_Vuex

Javascript 通过脚本标记包含Vuex.js时出现Vuex mapState引用错误

javascript vue.js vuejs2

Javascript 通过脚本标记包含Vuex.js时出现Vuex mapState引用错误,javascript,vue.js,vuejs2,vuex,Javascript,Vue.js,Vuejs2,Vuex,我正在为Vue.js运行一些测试代码，并通过脚本标记包含Vue.js、Vuex和javascript文件（因为它只是为了测试目的，我不想使用构建工具）大多数代码运行正常，但Vuex映射函数（mapState、MapGetter…）无法工作。我总是得到引用错误：找不到变量：mapState。为什么我不能访问mapState？当通过脚本标签包含时，这不是全局函数吗仅举一个使用vue文档中代码的示例： index.html <html> <head> <me

我正在为Vue.js运行一些测试代码，并通过脚本标记包含Vue.js、Vuex和javascript文件（因为它只是为了测试目的，我不想使用构建工具）

大多数代码运行正常，但Vuex映射函数（mapState、MapGetter…）无法工作。我总是得到

引用错误：找不到变量：mapState

。为什么我不能访问mapState？当通过脚本标签包含时，这不是全局函数吗

仅举一个使用vue文档中代码的示例：

index.html

<html>

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

    <title></title>
</head>


<body>

    <div id="app"></div>


    <!-- Libraries ---------- -->
    <script src="vendor/js/vue.js" type="text/javascript"></script>
    <script src="vendor/js/vuex.js" type="text/javascript"></script>

    <script src="app/js/store.js" type="text/javascript"></script>
    <script src="app/js/app.js" type="text/javascript"></script>

</body>

</html>

app.js

const app = new Vue({
    el: '#app',
    template: `
        <main>
            <h1 class="title">Heading</h1>
        </main>
    `,
    store,
    computed: {
        ...mapState([count])
    }
});

const-app=新的Vue({
el:“#应用程序”，
模板：`
标题
`,
商店，
计算：{
…映射状态（[计数]）
}
});

在我看到的许多代码示例中

import { mapState } from 'vuex'

用于允许引用mapState

但正如您所说，您通过引用Vue和Vuex的脚本而不是使用构建系统来包括它们

<script src="vendor/js/vue.js" type="text/javascript"></script>
<script src="vendor/js/vuex.js" type="text/javascript"></script>

除非包含您的代码。如果您将Vuex作为脚本而不是构建，则需要通过Vuex作为

Vuex.mapState

访问mapState。这让我更进一步。使用

computed:Vuex.mapState（{count:“count”}）

有效，但

computed:{…Vuex.mapState（{count:“count”}）}

会给我一个

语法错误：意外的标记“…”。需要属性名。

错误。在这里使用spread操作符有什么问题，因为我需要它来将状态与我自己的计算属性合并。对象spread（

…mapState

）目前在浏览器中并不广泛可用。你必须用老式的方法来做，你是对的。浏览器支持数组扩展，但不支持对象扩展。有一种简单的“老式方式”吗？我认为，所有局部计算属性都是计算对象内部的函数，而不仅仅是键：值对，这一事实将使它变得困难。

<script src="vendor/js/vue.js" type="text/javascript"></script>
<script src="vendor/js/vuex.js" type="text/javascript"></script>

Vuex.mapState