天天看点

150_Vue实战:参数传递及重定向

目录

参数传递

传递参数

修改路由配置, 主要是在 path 属性中增加了 :id 这样的占位符

接收参数, 在目标组件中

使用 props 的方式

修改路由配置 , 主要增加了 props: true 属性

接收参数为目标组件增加 props 属性

组件重定向

我们经常需要把某种模式匹配到的所有路由,全都映射到同个组件。例如,我们有一个 User 组件,对于所有 ID 各不相同的用户,都要使用这个组件来渲染。此时我们就需要传递参数了;

此时我们将 to 改为了 :to,是为了将这一属性当成对象使用,注意 router-link 中的 name 属性名称 一定要和 路由中的 name 属性名称 匹配,因为这样 Vue 才能找到对应的路由路径;

重定向的意思大家都明白,但 Vue 中的重定向是作用在路径不同但组件相同的情况下,比如:

说明:这里定义了两个路径,一个是 /main ,一个是 /goHome,其中 /goHome 重定向到了 /main 路径,由此可以看出重定向不需要定义组件;

使用的话,只需要设置对应路径即可;