• vue3的params传参失效的解决方案state


     vue3使用vue-router4.0,但是使用router.push的params传参,一直拿不到参数

    查阅资料如下:

     

    —————————————————————————————————————————— 

    state方案如下: 

    要传参的组件

    1. import { useRouter } from 'vue-router'
    2. const router = useRouter() // router跳转
    3. //某个按钮实现路由跳转
    4. //state里面是参数
    5. function editor(row) {
    6. router.push({
    7. name: 'EditorButton',
    8. state: {
    9. description: row.description,
    10. code: row.code,
    11. value: row.value
    12. }
    13. })
    14. }
    15. //这个name在router路由配置的时候写过了对应的组件

    接受参数的组件:直接用即可

    1. <span >配置项说明span>
    2. <span>{{ editInfo.description }}span>
  • //拿到路由传过来的数据
  • const editInfo = reactive(history.state);
  • 注意:好像只影响 router.push ,用to传参还是可以的

    1. <router-link
    2. :to="{ name: 'GameDetail', params: { gameId: row.gameId } }">
    3. {{ row.gameName }}
    4. router-link>

  • 相关阅读:
    Mybatis的特性详解——四大操作标签
    Qt Xml文件的创建和解析[xml和dom方式]
    4.3、Linux进程(2)
    Springboot考研教材查询系统wi7pz计算机毕业设计-课程设计-期末作业-毕设程序代做
    二分专题训练
    Linux高性能服务器编程——ch3笔记
    STM32H743XX/STM32H563XX芯片烧录一次后,再次上电无法烧录
    【复杂句的逻辑练习题】定语从句的省略
    Java-抽象类、抽象方法
    完全免费的PDF软件
  • 原文地址:https://blog.csdn.net/zmy967131/article/details/132837650