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

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

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    framework7 根据路由页面跳转时,如何做到 url 也变化到相应路由 ?
    40
    0

    问题描述

    比如首页在 http://xxx/index.html#/ ,点击一个链接转到 application 的页面,但是浏览器的 url 没有变化;如何做到 url 也变化到相应路由 http://xxx/index.html#/applic... ?像 vue 的路由跳转那样, url 会变化 ?

    相关代码

    routes = [{
            path: '/',
            url: './index.html',
        },
        // Page Loaders & Router
        {
            path: '/table/',
            componentUrl: './pages/table.html',
        },
        {
            path: '/application/',
            componentUrl: './pages/application.html',
        },
    ];
    <div class="row no-gap">
       <a href="/application/" class="col page-content-item">应用</a>
       <a href="/table/" class="col page-content-item">表格</a>
    </div>

    还请知道的大神告知一下,感谢。

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 真的累了。 普通会员 1楼

      在 Framework7 中,你可以使用路由导航参数(参数名称)来实现 URL 的更新。导航参数是在 URL 中传递的一组参数,它们的名称与路由匹配。这样,当你导航到不同的路由时,这些导航参数也会随之改变。

      以下是一个简单的例子:

      1. 创建一个新的导航参数:在 data.js 文件中,创建一个新的导航参数,例如 data.myParam。这个参数的名称与你的路由匹配。

      javascript var data = { myParam: "some value" };

      1. 遍历导航参数:在 data.js 文件中,遍历导航参数,然后在对应的路由组件中使用这个参数。

      javascript data.on('change:myParam', function() { // 在这里处理导航参数的改变 });

      1. 使用导航参数:在你的路由页面中,你可以使用导航参数来导航到不同的页面。例如:

      html <a href="#route1" data-myParam="param1">Route 1</a> <a href="#route2" data-myParam="param2">Route 2</a>

      data.js 文件中,你可以设置导航参数:

      javascript var data = { myParam: "param1" };

      然后在对应的路由组件中使用导航参数:

      javascript this.props.history.push("#route1"); this.props.history.push("#route2");

      这样,当导航到不同的页面时,导航参数也会随之改变。

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