当前位置: 首页 > article >正文

VueRouter之props参数

只要在配置路由的时候增加props:true

                    children: [
                        {
                            path: 'detail/:id/:content',
                            name: 'detail',
                            props:true,
                            component: () => import('../views/DetailView.vue'),
                        }
                    ]

不么在DetailView.vue这个页面中,就可以直接使用传递过来的params参数了

<template>
  <ul class="">
    <li>
      编号:{{ id }}
      <hr />
    </li>
    <li>
      内容:{{ content }}
    </li>
  </ul>
</template>

<script>
export default {
  mixins: [],
  components: {},
  props: ['id', 'content'],
  data() {
    return {
    }
  },
  computed: {},
  watch: {},
  created() { },
  mounted() { 
    console.log(this.$route);
  },
  methods: {},
}
</script>
<style scoped></style>


http://www.kler.cn/a/465256.html

相关文章:

  • QML自定义滑动条Slider的样式
  • 旧服务改造及微服务架构演进
  • 【Rust自学】9.4. 什么时候该使用panic!
  • 《前端web开发-CSS3基础-1》
  • 关于PINN进一步的探讨
  • 《learn_the_architecture_-_generic_interrupt_controller_v3_and_v4__lpisn》学习笔记
  • dockerfile中su命令如何切换用户激活环境,报错su: invalid option -- ‘n‘
  • 【专题】2024年出口跨境电商促销趋势白皮书报告汇总PDF洞察(附原数据表)
  • coredns报错plugin/forward: no nameservers found
  • QT-------------多线程
  • checked 溢出问题
  • Javascript-web API-day04
  • canvas+fabric实现时间刻度尺(一)
  • 渗透Vulnhub-tr0ll靶机
  • 【开源社区openEuler实践】compass-ci
  • v-model响应式数据失效(能打印出来,但不渲染响应新数据)出现在异步操作或动态添加属性时赋值,使用 this.$set:
  • 比亚迪30亿教育慈善基金正式启动,助推中国科教进步
  • Go 如何优雅退出进程
  • mysql之组内排序ROW_NUMBER()函数
  • Agent系列:AppAgent v2-屏幕智能Agent(详解版)
  • Ajax数据爬取
  • 定制级安全重保方案,确保重大活动期间的网络安全无忧
  • Tailwind CSS:现代 CSS 框架的优雅之选
  • redis的集群模式与ELK基础
  • STM32传感器系列:GPS定位模块
  • 活动预告 |【Part1】Microsoft Azure 在线技术公开课:使用 Azure DevOps 和 GitHub 加速开发