首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >基于VueJS的动态组件和模板加载

问基于VueJS的动态组件和模板加载
EN

Stack Overflow用户
提问于 2014-09-29 06:12:36
回答 2查看 12.8K关注 0票数 7

我正在考虑使用VueJS作为一个多页面的网站。在正式的路由示例中,它们显示您可以根据URL动态地更改模板和组件,但是它们仍然在一个文件中同时加载所有的HTML和JS组件。

我的网站将会很大,我只想在需要的时候加载所有的东西。因此,我的问题是:如何异步加载这些模板和JS组件, modified ,当URL被更改时?,只需展示如何修改上面的路由示例来加载动态脚本。

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2014-10-01 16:01:07

更新:请参阅官方文档中的异步组件部分。

票数 9
EN

Stack Overflow用户

发布于 2015-12-09 15:59:40

硬编码但工作。Webpack的解决方案对初学者来说太难了,就像我一样。

代码语言:javascript
复制
var router = new VueRouter({hashbang:false})
var routerMap = {};

router.beforeEach( function (transition) {
    var path = transition.to.path;
    if ((path != '/') && !(path in routerMap)) {
        _ajax('/reports/'+ path + '.html', function(res){//$.ajax replacement (async)
            routerMap[path] = {
                component: {
                    template: res 
                }
            }; 
            router.on(path, routerMap[path]);   //associate dynamically loaded component            

            transition.abort();     //abort current
            router.stop();                          
            router.start();         //restart router
            router.go(path);        //init new transition to the same path
        });//_ajax 
  } else 
        transition.next();          //default action for already loaded content
});
票数 3
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/26093526

复制
相关文章

相似问题

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