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

Vue-14-前端框架Vue之应用基础嵌套路由和路由传参

文章目录

  • 1 嵌套路由
    • 1.1 News.vue
    • 1.2 Detail.vue
    • 1.3 router/index.ts
  • 2 路由传参
    • 2.1 query参数
      • 2.1.1 News.vue(传递参数)
      • 2.1.2 Detail.vue(接收参数)
    • 2.2 params参数
      • 2.2.1 router/index.ts(需要提前占位)
      • 2.2.2 News.vue(传递参数)
      • 2.2.3 Detail.vue(接收参数)
    • 2.3 props配置
      • 2.3.1 router/index.ts
      • 2.3.2 Detail.vue(接收参数)

三种方式进行路由传参:query参数、params参数、props配置。

1 嵌套路由

(1)点击新闻,跳转到新闻页。
(2)点击每一个新闻,查看具体的新闻详情。

1.1 News.vue

<template><div class="news"><!-- 导航区 --><ul>
http://www.lryc.cn/news/575432.html

相关文章:

  • 【fish-speech】新模型openaudio-s1-mini尝鲜
  • 【windows处理技巧】如何缩小PDF
  • R语言机器学习算法实战系列(二十六)基于tidymodels的XGBoost二分类器全流程实战
  • 【力扣 困难 C】32. 最长有效括号
  • 数据结构进阶 - 第三章 栈与队列
  • ubuntu 下cursor的安装
  • 深入了解 AWS EventBridge
  • 多相机人脸扫描设备如何助力高效打造数字教育孪生体?
  • Java设计模式->责任链模式的介绍
  • 书籍在行列都排好序的矩阵中找数(8)0626
  • 【音视频】Ubuntu下配置ffmpeg库
  • Maven Javadoc 插件使用详解
  • 【WebSocket】学习总结
  • Python 数据分析与可视化 Day 8 - Pandas 高级操作技巧
  • MFC制作动态波形图( ChartCtrl)
  • Python(一)实现一个爬取微信小程序数据的爬虫+工程化初步实践
  • 【FR801xH】Ubuntu24.04搭建富芮坤FR801xH系列开发环境教程
  • 美团京东Clean Architecture实战
  • 【算法深练】栈特性的解题密码:LIFO规则在题型中的灵活运用
  • 生僻字处理工具类
  • 价格敏感带争夺战!澳洲电商双雄增长密码,3大本土护城河尚存
  • C# 项目使用obfuscar混淆
  • 华曦达港股IPO递表,AI Home生态构建智能生活新蓝图
  • 2025 Java开发生态全景图:云原生、AI与性能优化的技术融合
  • 广州华锐互动:技术与创意双驱动的 VR 先锋​
  • 基于组件的软件开发(CBSD)与面向服务的架构(SOA)的对比分析
  • Android-Layout Inspector使用手册
  • VSCode插件开发
  • Vue3 中 toRef 与 toRefs 的深度解析与实战应用
  • Sentinel 授权规则详解与自定义异常处理