講解vue router之什麼是動態路由

2022-10-03 16:36:14 字數 804 閱讀 2835

github:

1、動態路由有乙個什麼適用場景呢?

比如在寫商品詳www.cppcns.com情頁面的時候,頁面結構都一樣,只是商品id的不同,所以這個時候就可以用動態路由動態。

2、官方文件

首先我們來看看官方文件上是怎麼解釋動態路由的?(

你可以在乙個路由中設定多段「程式設計客棧路徑引數」,對應的值都會設定到$route.params中。例如:

路徑引數

3、動程式設計客棧手試一試

看不懂?有點迷糊?沒關係,我們親自上手試一試,實踐出真章嘛。

① 首先我們動手試一下上面**中第乙個模式的實現,我們新建乙個資料夾並命名為view,然後在資料夾下新建test.vue

test.vue

② 到router資料夾下 》index.js檔案 》開啟並輸入

index.js

③ 再到test.vue元件中敲:

test.vue

在這裡需要說明一下$route.params.testid是什麼意思了,大概你也猜得出來,就是獲取當前路由的引數。

④ 現在輸入localhost:8080/#/test/這裡隨便帶個什麼引數」就可以就可以看到:

image.png

以上這就是動態路由的第乙個模式了。

如果第乙個模式你能看懂,那麼**中的第二個模式也就不在話下,我就不做標註解釋了,同理;有疑問留言。

上圖:修改路由index.js檔案

修改test.vue檔案

瀏覽器中輸入

參考鏈結

本文標題: 講解vue-router之什麼是動態路由

本文位址:

講解vue router之什麼是程式設計式路由

前言 程式設計式路由在我們的專案使用過程中最常用的的方法了。github 什麼是程式設計式路由呢?就是通過寫js 來實現頁面的跳轉 1.router.push name 或者 router.push 首先我們來講講簡單的,上面兩個方法記住,等效的。還是在test.vue元件裡面寫個div並給它新增乙...

什麼是高併發 ,詳細講解什麼是高併發 ,詳細講解

高併發 high concurrency 是網際網路分布式系統架構設計中必須考慮的因素之一,它通常是指,通過設計保證系統能夠同時並行處理很多請求。高併發相關常用的一些指標有響應時間 response time 吞吐量 throughput 每秒查詢率qps query per second 併發使用...

什麼是全棧 舉例講解

1 公司創始人 co founder,全棧 技術 產品 設計 運營 銷售 法務 融資 pr,作為公司創始人,在早期真的就是chief everything officer.你必須至少在上述的若干方面精通其中的某一項或幾項,對於其它項也要有一定的涉獵或最基本的了解。並且你的精通項必須與公司的業務形態相...