Mais conteúdo relacionado
Semelhante a JS Lab2017_Lightning Talks_React Perfomance (20)
Mais de GeeksLab Odessa (19)
JS Lab2017_Lightning Talks_React Perfomance
- 16. Styling
class Avatar extends PureComponent {
render () {
return <img src="./public/avatar.png" {...this.props} />
}
}
class Styling extends PureComponent {
render () {
return <Avatar style={{width: '100px'}} />
}
}
9
- 17. Styling
class Avatar extends PureComponent {
render () {
return <img src="./public/avatar.png" {...this.props} />
}
}
class Styling extends PureComponent {
render () {
return <Avatar style={{width: '100px'}} />
}
}
9
- 19. Styling
class Avatar extends PureComponent {
render () {
return <img src="./public/avatar.png" {...this.props} />
}
}
const style = {width: '100px'}
class StylingFixed extends PureComponent {
render () {
return <Avatar style={style} />
}
}
10
- 20. Styling
class Avatar extends PureComponent {
render () {
return <img src="./public/avatar.png" {...this.props} />
}
}
const style = {width: '100px'}
class StylingFixed extends PureComponent {
render () {
return <Avatar style={style} />
}
}
10
- 23. Inline handler
class Avatar extends PureComponent {
render () {
return <img src="./public/avatar.png" {...this.props} />
}
}
class InlineHandler extends PureComponent {
render () {
return <Avatar onClick={()=>{this.setState({clicked:true})}} />
}
}
12
- 24. Inline handler
class Avatar extends PureComponent {
render () {
return <img src="./public/avatar.png" {...this.props} />
}
}
class InlineHandler extends PureComponent {
render () {
return <Avatar onClick={()=>{this.setState({clicked:true})}} />
}
}
12