-
如果props.data.stars是有值的就取该值，否取值为0
查看全部 -
id值相同用===，如果相同，将item中的comment、stars、ifCommented（值为true）修改掉，如果不同，仍然返回item
查看全部 -
在挂载函数compoentDidMount中获取后台数据，使用html5的fetch函数请求数据。
在构造函数中定义一个初始的state值。
查看全部 -
在React中写js需要用到{}
查看全部 -
从props中获取data，从data中拿到shop、product、price、picture字段
查看全部 -
React的基本框架
查看全部 -
input的值一旦被改变，会触发onChange方法，onChange方法中的setState方法给value赋值，组件会重新渲染，render会被重新执行，value就会被设置成state中的value的值。
查看全部 -
若没有bind的语句的话，handleClick事件中的this指的是button的点击事件对象
也可以通过es6的箭头函数来表示该this是当前组件
查看全部 -
不再React中和在React中写事件：
查看全部 -
组件的挂载状态的方法：
constructor（）
render（）
componentDidMount（）
组件更新状态的方法有：
render()
componentDidUpdate()
组件的卸载状态的方法有：
componentWillUnmount()
查看全部 -
安装插件
npm intellisense
Path intellisense
Prettier-code formatter
Reactjs code snippets
查看全部 -
map ...
查看全部 -
onClick={this.handleClickStars.bind(this, item)}
给当前点击事件传值（当前项）
查看全部 -
Props 和 State 的区别
二者都是数据传递的形式
前者对外父子组件之间通信
后者对内负责数据的修改
查看全部 -
//list item css file
.orderItem {
display: block;
padding: 11px 10px 11px 15px;
}
.orderItem__picContainer {
padding-right: 10px;
display: inline-block;
}
.orderItem__pic {
width: 90px;
height: 90px;
}
.orderItem__content {
display: inline-block;
width: calc(100% - 100px);
}
.orderItem__product {
max-width: 237px;
font-size: 17px;
font-weight: 700;
color: #111;
padding-right: 8px;
box-sizing: border-box;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.orderItem__shop {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 13px;
color: #777;
padding-top: 9px;
padding-bottom: 13px;
}
.orderItem__detail {
display: flex;
justify-content: space-between;
height: 22px;
line-height: 22px;
padding-right: 4px;
}
.orderItem__price {
font-size: 13px;
color: #777;
vertical-align: 1px;
margin-left: 10px;
}
.orderItem__price::before {
content: "\A5";
margin-right:1px;
}
.orederItem__btn {
width: 80px;
height: 22px;
text-align: center;
color: #fff;
border: 0;
font-size: 14px;
}
.orederItem__btn--red {
background-color: #e9203d;
}
.orederItem__btn--grey {
background-color: #999;
}
.orderItem__StarContainer{
margin: 3px 0;
}
.orderItem__star {
font-size: 22px;
cursor: pointer;
color: #ccc;
}
.orderItem__star--red {
color: #e9203d;
}
.orderItem__star--light {
color: #ccc;
}
查看全部
举报