id的传递路径,我理解的有问题吗?

来源:4-2 使用动态路由获取不同列表内容(2)

Aurora_Meteor

2020-06-02 16:11:31

先在Header组件的Link标签中发送id,http://img.mukewang.com/climg/5ed608dd0990554505450291.jpg

然后在index.js中的Route标签里跳转路由的时候被接收到,并且id参数被传递给调用的组件List

http://img.mukewang.com/climg/5ed6091d09500ae806330379.jpg

因为是通过父组件(上图中的Route标签中的{List})传递过来的,所以最后在List组件中就可以使用this.props获取到数据,从而通过下面代码获取到传递过来的id参数

http://img.mukewang.com/climg/5ed609a609d6021507160292.jpg

写回答

2回答

好帮手慕糖

2020-06-02

同学你好,这个值传递的顺序是对的,但是理解稍微有点歧义,这个不是通过父子组件传递的,这里是通过路由哦,可以参考如下:

1、link里的item.id和index.js中route里的:id是同一个id值。

点击a标签,href值会显示在地址栏中:

http://img.mukewang.com/climg/5ed61fdc0925f5bf02200046.jpg

然后index.js中会通过动态路由匹配到第二个route:

http://img.mukewang.com/climg/5ed61fcc09b41e5508260446.jpg

2、path 属性中的 :id 就是路由的参数( param ), 组件中,可以直接通过 this.props.params.id 来访问实际的参数值(这里的id和定义路径的 :id 相对应)

这里就是在组件中通过获取地址栏中的id值,然后拼接在url上,获取相对应的数据。

如果我的回答帮助了你,欢迎采纳,祝学习愉快~

0
hurora_Meteor
h 就只是把我描述中的组件改为路由就行了吧,传递顺序就是从那几个文件的相应地方传过去的吧
h020-06-02
共1条回复

好帮手慕糖

2020-06-02

同学你好 ,是的哦。

0

0 学习 · 10739 问题

查看课程