账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    基于vue的单页Web应用,如何做到按需加载其它页面?
    29
    0

    目前正在学vue,刚学到能使用vue-cli开始开发,但是我发现参照vue-cli构建的脚手架写的页面(即在src/components/下写.vue文件),会全部打包在一个js文件里,那如果页面很多,岂不是首次进入会很慢?

    我想深一步学下去,请问要怎么把这些页面分开?最好是一个页面一个js

    ps. 我构建的脚手架是不含编译器的,请问是否有必要含一下?

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 色牲 普通会员 1楼

      在Vue.js中,可以使用动态路由(动态路由是根据URL动态生成路由的),根据需要加载不同的页面。以下是一个基本的步骤:

      1. 在你的Vue.js应用中,使用router模块来定义路由。

      ```javascript import Vue from 'vue' import Router from 'vue-router' import Home from '@/views/Home.vue'

      Vue.use(Router)

      export default new Router({ routes: [ { path: '/', component: Home }, // 你的其他路由 ] }) ```

      1. 在你的Home.vue组件中,设置router-linkto属性,指向你想要加载的页面。

      ```html ```

      1. 在你的Other-page.vue组件中,你可以在template中使用router-view来显示其他页面的内容。

      ```html ```

      1. 通过在你的Home.vue组件的router-link中使用router-link-to,你就可以动态地改变你的应用的路由,从而实现按需加载不同的页面。

      2. 如果你的应用需要处理多个页面,你可以在你的路由中添加更多的path属性,分别对应不同的页面。

      例如:

      javascript export default new Router({ routes: [ { path: '/', component: Home }, { path: '/about', component: About }, { path: '/contact', component: Contact } ] })

      这样,你就可以在不同的页面中加载不同的内容。

    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部