使用环境react脚手架
node.js
create-react-app 文件名
配置完这些就让我们开始把
count.js
import React, { Component } from 'react'
import store from '../redux/store.js'
export default class Computer extends Component {
state = {
count: 0
}
// 加
addcount = () => {
this.setState({
count: this.state.count + this.refSelect.value * 1
})
}
// 减
minuscount = () => {
this.setState({
count: this.state.count - this.refSelect.value * 1
})
}
// 乘
ridecount = () => {
this.setState({
count: this.state.count * this.refSelect.value
})
}
// 异步加
asynccount = () => {
setTimeout(() => {
this.setState({
count: this.state.count + this.refSelect.value * 1
})
}, 1000)
}
render() {
const {count} = this.state
return (
<div>
<h2>得到的参数是:{count}</h2>
<select ref={e => (this.refSelect = e)}>
<option value={1}>1</option>
<option value={2}>2</option>
<option value={3}>3</option>
</select>
<button onClick={this.addcount}>+</button>
<button onClick={this.minuscount}>-</button>
<button onClick={this.ridecount}>*</button>
<button onClick={this.asynccount}>异步加</button>
</div>
)
}
}