手记

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

课程名称: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组件中进行传参。

课程收获:

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




0人推荐
随时随地看视频
慕课网APP