V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
matts8023
V2EX  ›  前端开发

在 webpack 下 main.js 中定义的变量为什么在组件中访问不到?

  •  
  •   matts8023 · 2017-02-09 14:54:46 +08:00 · 3953 次点击
    这是一个创建于 2826 天前的主题,其中的信息可能已经有所发展或是发生改变。

    如题,我用的是 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...

    5 条回复    2017-02-09 15:11:41 +08:00
    v1024
        1
    v1024  
       2017-02-09 15:04:40 +08:00
    这跟 Webpack 无关
    变量的作用域没你想的那么大
    模块无法访问父级作用域
    除非你放在 window 对象上
    echol
        2
    echol  
       2017-02-09 15:06:59 +08:00
    gzlock
        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
    matts8023
        4
    matts8023  
    OP
       2017-02-09 15:08:15 +08:00
    @v1024 已经尝试把他放到 windows 对象上了,但是在 vue 内访问依旧未定义。
    matts8023
        5
    matts8023  
    OP
       2017-02-09 15:11:41 +08:00
    @echol 嗯,可以用,谢谢!
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5293 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 09:25 · PVG 17:25 · LAX 01:25 · JFK 04:25
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.