Dva router跳转传参

冷不防 2023-07-13 13:40 17阅读 0赞

第一种

window.location.href = '/app?id=1';
    // 跳转到的页面取值
    import querystring from 'querystring';
    console.log(querystring.parse(location.search.replace('?', '')).id);

第二种

import { withRouter } from 'dva/router';
    
    class App extends Component {
      ...
      go = () => {
        // this.props.history.push({ pathname: '/要跳转的路径', state: { key值：val值 } });
        this.props.history.push({ pathname: '/app', state: { id：12 } });
      }
    }
    export default withRouter(connect()(App));
    
    // 跳转到的页面取值
    console.log(this.props.location.state.id);

第三种

import { routerRedux } from 'dva/router';
    
    this.props.dispatch(routerRedux.push(`/app/template/editor?id=${myId}`));
    // 或
    this.props.dispatch(routerRedux.push({
          pathname: '/app/xxx',
          search: `id=${myId}`,
    }))
    
    // 跳转到的页面取值
    console.log(this.props.location.xxx);

第四种

import { Link } from 'dva/router';
    
    <Link to={
       {
         pathname:`/要跳转的路径`,
         state:{key值：val值}
       }
    }>
    // 跳转到的页面取值
     //console.log(this.props.location)  // 传递过来的所有参数
    console.log(this.props.location.state.key值)  // val值

发表评论取消回复

表情：

评论列表（有 0 条评论，17人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue-router路由跳转&路由传参

对于大多数单页面应用，都推荐使用官方支持的 [vue-router 库][vue-router]。更多细节可以移步 [vue-router文档][vue-router 1] 。

淡淡的烟草味﹌/ 2023年10月06日 17:18/ 0 赞/ 19 阅读

相关 Vue Router 路由跳转传参实践

Vue Router 路由跳转传参实践文章目录 Vue Router 路由跳转传参实践一、动态路由匹配 1、路由配置 2、

╰+哭是因爲堅強的太久メ/ 2023年09月26日 20:27/ 0 赞/ 152 阅读

相关 Vue中router.push跳转传参

纯跳转 this.$router.push('/home') // 向地址栏历史添加一条。可以回退 this.$router.replace(

短命女/ 2023年07月24日 05:36/ 0 赞/ 13 阅读

相关 Dva router跳转传参

第一种 window.location.href = '/app?id=1'; // 跳转到的页面取值 import querystring f

冷不防/ 2023年07月13日 13:40/ 0 赞/ 18 阅读

相关 $router.push()跳转页面传参

query this.$router.push(\{path:'/router1', query: \{ id: 123\}\}) \-------------/route

小鱼儿/ 2023年06月15日 11:09/ 0 赞/ 24 阅读

相关 vue this.$router.push跳转传参教程

vue this.$router.push跳转传参教程缘起基本用法缘起 `项目多且杂，跳转肆年华。风卷花落去，不知入谁家`。今天就说说跳转携带参

柔情只为你懂/ 2022年12月24日 00:40/ 0 赞/ 159 阅读

相关 vue页面跳转传参

使用以下方式传参： `this.$router.push({ path: 'registerowner', name: "registerowner", params:{c

曾经终败给现在/ 2021年09月28日 22:32/ 0 赞/ 532 阅读

相关 vue-router传参

1.vue-router传参 extraButtons: [ { type: "success", text: "查看"

╰+哭是因爲堅強的太久メ/ 2021年07月25日 22:25/ 0 赞/ 444 阅读

相关 AngularJs ui-router路由跳转传参

1、在跳转a标签中通过跳转指令设置 ui-sref='state名称({键值对1,键值对2})' 其中,值如果是变量会自动解析,如果是字符串需

妖狐艹你老母/ 2021年07月25日 01:52/ 0 赞/ 432 阅读

相关 mpvue 页面跳转传参

1、跳转传参回调中 wx.navigateTo({ url:'根据当前文件的相对路径/?键值对' })

谁践踏了优雅/ 2021年07月24日 16:26/ 0 赞/ 561 阅读