为了账号安全,请及时绑定邮箱和手机立即绑定
首页 手记 【金秋打卡】第17天 react16实现订单列表和评价功能

【金秋打卡】第17天 react16实现订单列表和评价功能

2022.11.09 18:23 42浏览

课程名称:react16实现订单列表及评价功能

课程章节:订单评价功能3

课程讲师: 艾特老干部

课程内容:本节课还是继续订单评价功能的编写,上一节课是说订单功能事件的实现,那这节课就讲的是父子组件之间的交互。this.props.doSubmit在orderList组件中如何实现。在orderList组件中的<orderItem doSubmit={this.handleSubmit}>,然后定义handleSubmit方法,handleSubmit=(id,comment,star) =>{const newData = this.state.data.map(item=>{return item.id === id ? {...item,comment,star,ifComment :true} : item});this.setState({data:newData})},把原来定义死的orderItem的初始化数据改成先取props里的,没有再给默认值。取消按钮事件的时候也是一样,先给props里的值,再给默认值。根据prop里的数据来判断五角星的样式要亮几颗,没有给的就默认灰色。如果是用引用组件的方式,引用组件的时候要把data绑定上<orderItemEditing data={item} /> ,onSubmit也要绑定上

课程收获:

这节课的内容主要是继续讲订单评价功能代码编写。跟着手敲代码,实现效果。orderItem和ordeList组件之间的交互。接下来就继续...

https://img2.sycdn.imooc.com/636b7f9e0001354013030670.jpg

点击查看更多内容
0人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
Web前端工程师
手记
粉丝
0
获赞与收藏
4

关注TA,一起探索更多经验知识

同主题相似文章浏览排行榜

风间影月说签约讲师

51篇手记,涉及Java、MySQL、Redis、Spring等方向

进入讨论

Tony Bai 说签约讲师

151篇手记,涉及Go、C、Java、Python等方向

进入讨论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消