首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Vue.js +vue资源+vue路由器=词汇声明错误?

Vue.js +vue资源+vue路由器=词汇声明错误?
EN

Stack Overflow用户
提问于 2017-01-12 15:52:45
回答 2查看 1.4K关注 0票数 1

当尝试将Vue.js与vue-资源和vue-路由器一起使用时,会显示一个错误:

ReferenceError:初始化前无法访问词法声明“`vm”

就我跟踪的错误而言,它只在页面加载了初始路由时才出现,例如test.com/ #/file ( error )和test.com/(无错误)。如果将requestDirectory()的所有代码替换为next(),则不会显示错误。因此,它似乎继承了代码结构。有什么想法吗?

代码语言:javascript
运行
复制
const routerComponents = {
    home: {     template: '<p>Home ...</p>' },
    files: { template: '<p>Files</p>' }
};

function requestDirectory(to, from, next) {
    console.log("Loading files in ...");
    vm.$http.post('/api/dir', {dir: 'photos'}).then((res) => {
        console.log("done");
        next()
    }, (err) => {});
}

const router = new VueRouter({
    routes: [
        { path: '/', component: routerComponents.home },
        { path: '/files', component: routerComponents.files, beforeEnter: requestDirectory }
    ]
});

const vm = new Vue({
    data: {
        title: 'Home'
    },
    router: router
});

window.onload = function() {
    vm.$mount('#app');
};
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-01-12 16:26:47

您无法在vm回调中访问beforeEnterthis,因为此时尚未创建组件的实例。尝试将代码移动到组件实例事件(如created )提供的代码之一。

更新

只需将vm.$http替换为全局快捷方式Vue.http

在文档那里中找到。

票数 1
EN

Stack Overflow用户

发布于 2017-01-12 16:49:11

这就是varconst/let在ES6中的区别。

ES6仍然会将let/const变量提升到块的顶部。但是,在const/let声明之前使用变量将导致ReferenceError。该变量从块的开始一直到声明被处理都处于“时间死区”。

有关更多信息,请参见ECMAScript 2017语言规范13.3.1作出声明

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/41617527

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档