为了账号安全,请及时绑定邮箱和手机立即绑定

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

标签:
React.JS React

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

课程章节:订单项组件

课程讲师: 艾特老干部

课程内容:

组件的划分,左边是图片,右边是产品的信息。编写组建的基本标签结构,左边是图片,右边是产品的信息,包括产品名称、商家名称、产品数量和按钮。显然这里的组件还没有完成,要加上样式,使用的是BEMSS的样式结构,这样能够看出样式的层级结构。父className=orderItem ,子className=orderItem_picContainer--red(这里是颜色),然后引入相关的文件,这样就编写好了orderItem组件。orderItem组件是使用在orderList组件中的,所以要简单的编写orderList组件,在orderList组件中引入OrderItem组件,然后在app.js中引入orderList组件,在界面上就能正常显示orderItem组件了。但是按钮没有显示,因为样式没有调整好。按钮是有红色和灰色的,先给个红色的修饰符className = "orderItem_btn orderItem_btn--red"。显然这也还是不完整的,要在render下建一个const {shop,product,price,picture} = this.props.data。然后在orderList组件中进行传参。

课程收获:

这节课的内容主要是讲订单项组件的代码编写。嚯嚯嚯,代码编写。接下来就继续...




https://img3.sycdn.imooc.com/6364e37c0001b1c012850676.jpg

点击查看更多内容
TA 点赞

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

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消