在 webpack 下 main.js 中定义的变量为什么在组件中访问不到？
matts8023 · 2017-02-09 14:54:46 +08:00 · 3967 次点击这是一个创建于 2847 天前的主题，其中的信息可能已经有所发展或是发生改变。
如题，我用的是 vue2.0 + vue-router2.0 + vue-loader + webpack ，在 main.js 中定义了 router 变量，但是在的 vue 文件中访问 router 变量却提示没有定义，难道 webpack 下每个 js 文件中的变量都是限定在特定文件内的嘛？
main.js 片段如下：
import Vue from 'vue'
import VueRouter from 'vue-router'
import App from './views/app.vue'
Vue.use(VueRouter)
const router = new VueRouter({
routes: [{
name: 'index',
path: '/',
component: require('./views/index.vue')
}]
})
new Vue({
el: '#app',
router: router,
render: h => h(App)
})
app.vue 片段如下：
<template>
<router-view></router-view>
</template>
index.vue 片段如下
<template>
<div id="page-index"></div>
</template>
<script>
export default {
data() {},
mounted() {
alert(router)
}
}
</script>
访问 "/" 路由时提示 router 未定义，这是为什么？昨天刚学 webpack ，看到一脸懵逼 T.T...
 |
1
v1024 2017-02-09 15:04:40 +08:00
这跟 Webpack 无关
变量的作用域没你想的那么大 模块无法访问父级作用域 除非你放在 window 对象上 |
 |
2
echol 2017-02-09 15:06:59 +08:00
|
 |
3
gzlock 2017-02-09 15:07:51 +08:00 via Android  1
1 用了 router ，就不需要 render （ app ），参考：
http://router.vuejs.org/zh-cn/essentials/getting-started.html 2 组件内（你的 index.vue ）使用 this.$router 访问 router 对象，参考： http://router.vuejs.org/zh-cn/api/route-object.html |
Select Language