react实现点击循环数据中的button，弹出弹窗或者产生新的数据

在最近的一次项目中，根据项目需求，需要做一个如下的需求

点击+button，产生一个新的链接输入框
思路解析：
根据数据循环产生多少个button，我们需要循环生成多少个容器，然后将所有生成的容器放到一个公共的数据容器里面，让后面能够使用数据的时候给方便
在state中定义一个公共的数据容器：

this.state={
	addLinks:[],
	addLink:0 //初始化点击数据
}

在页面初次渲染完后进行生成点击button容器

this.state.test.forEach((item,index)=>{
	this.state.addLinks.push([])
})

点击button事件：

e:表示当前点击button
index：表示当前点击的butotn的index/是哪个button
addLink(e,index){
	this.setState({
		addLink:this.state.addLinks + 1
	})
	// 给点击的button中做一个对象存储器，用于存储链接输入框的数据
	this.state.addLinks[index].push({
		value:''
	})
}

渲染新的链接数据框

 this.state.Links[index] !== undefined &&
   this.state.Links[index].length > 0 ?
    this.state.Links[index].map((item,_index)=>{
        return(
            <Row gutter={24} key={_index}>
                <Col span={13}>
                <span style={{ marginLeft: 5 }}>链接:</span> <Input
                        style={{ width: 400 }}
                        value={item.value}
                        type="text"
                        onChange={e => {
                            this.addLinkChange(e,index,_index)
                        }}
                    />
                </Col>
            </Row>
        )
    }):''

输入框输入数据

addLinkChange(e,index,_index){
	var prevState = this.state.Links
    var val = e.target.value
     this.setState(()=>{
         let temp=[
             ...prevState
         ]
         temp[index][_index].value = val
     })
}