export default class UserComponent extends React.Component {
constructor(props) {
super(props);
this.state = {
columns: [
{
type: 'selection'
},
{
label: "ID",
prop: "uid",
width: 150
},
{
label: "姓名",
prop: "username",
width: 160
},
{
label: "地址",
prop: "cellphone"
}, {
label: "操作",
width: 120,
fixed: 'right',
render: (row, column, index)=>{
return <span><Button type="text" size="small" onClick={this.deleteRow.bind(this, index)}>移除</Button></span>
}
}
],
data: [],
list:[],
lat_page:"",
username:""
}
}
deleteRow(index) {
const { data } = this.state;
data.splice(index, 1);
this.setState({
data: [...data]
})
}
selectRow(){
fetch('https://a.daxiangclass.com/offer.php/api/v1/user?searchKeyword='+this.state.username+'&page=1&size=10')
.then(res => res.json())
.then(json=>{
this.setState({
data:json.data
})
})
}
componentDidMount(){
fetch('https://a.daxiangclass.com/offer.php/api/v1/user?searchKeyword=&page=1&size=10')
.then(res => res.json())
.then(json=>{
this.setState({
data:json.data,
lat_page:json.last_page
})
console.log(this.state.data)
})
}
render() {
return (
<div className="student">
<input type={"text"} placeholder={"输入关键字"} onChange={e=>{this.setState({username:e.target.value})}} />
<button className="btn" onClick={this.selectRow.bind(this)}>搜索</button>
<Table
style={{width: '80%'}}
columns={this.state.columns}
data={this.state.data}
border={true}
height={660}
onSelectChange={(selection) => { console.log(selection) }}
onSelectAll={(selection) => { console.log(selection) }}
/>
<Pagination onCurrentChange={page=>{
fetch('https://a.daxiangclass.com/offer.php/api/v1/user?searchKeyword=&page='+page+'&size=10')
.then(res=>res.json())
.then(json=>this.setState({data:json.data},()=>{
console.log(this.state.data) })) }} layout="prev, pager, next" total={50} small={true}/> </div> ); }}
