react新增一行数据删除一行数据

import React, { Component} from 'react'
import {Table,Button,message,Popconfirm,Row,Col,Form,Input,Select,Icon,Modal} from 'antd'
import {fetchPost, fetchPostXd} from '../../../../utils/request'
import {history, origin} from "../../../../utils/config"

const FormItem = Form.Item;
class List extends React.Component {
  constructor(props){
    super(props)
    this.state={
      listA:[""],
      listB:[""],
    }
  };

  addValue(){
    this.state.listA.push("")
    this.setState({
      listB:this.state.listA
    })
  }
  changeValue(i,value){
    this.state.listA[i] = value
    this.setState({
      listB:this.state.listA
    })
  }
  del(index){
    var lists=this.state.listB;
    lists.splice(index,1);
    this.setState({listB:lists})
  }
  componentDidMount() {

  }
  render(){
    return(
      <div>

        {
          this.state.listB && this.state.listB.map((item,i)=>{
            console.log("i==="+i+"item"+item)
            return(
              <div key={i}>
                <Input type="text" value={item} onChange={(e)=>{this.changeValue(i,e.target.value)}}/> <a onClick={()=>this.del(i)}>删除</a>
                <br/>
              </div>
            )
          })
        }
        <Button onClick={(e)=>{this.addValue()}} >添加</Button>

      </div>
    );
  }
}

List = Form.create()(List);
export default List