react + ant select自定义多选+Popconfirm气泡提示框 【单个】

js 部分：可以查看ant api 进行理解

tagRender = (props) => {   //自定义方法  可以查看ant api 进行理解
    const { label, value, closable, onClose } = props
    const confirmRelation = () => {   //确定调用
      this.setState({
        Relationshow: value,
        relationNewOpen: false,
      })
      let RelationData = this.state.relationDeleteData[0].RelationData
      let ID = ''
      RelationData.some((item) => {
        if (item.RelationFieldId === value) {
          ID = item.Id
          return item
        }
      })
      let params = { Id: ID }
      if (ID) {
        DeleteBusinessAssociationOnlyOne(params)
          .then((res) => {
            if (res.data.Success) {
              message.success('删除成功！')
              this.getAllFiledList()
              this.setState({
                [`openRelation${value}`]: false,
              })
              onClose()
            } else {
              message.error(res.data.Error)
              this.setState({
                [`openRelation${value}`]: false,
              })
            }
          })
          .catch((err) => {
            message.error(err)
            this.setState({
              [`openRelation${value}`]: false,
            })
          })
      } else {
        this.setState({
          [`openRelation${value}`]: false,
        })
        onClose()
      }
    }
    const cancelRelation = (event) => {   //取消调用
      event.preventDefault()
      event.stopPropagation()
      this.setState({
        [`openRelation${value}`]: false,
        relationNewOpen: false,
      })
    }
    const onPreventMouseDown = (event) => {    //阻止冒泡
      event.preventDefault()
      event.stopPropagation()
    }

    return (
      
         {
            e.preventDefault()
            this.setState({
              [`openRelation${value}`]: true,
              relationNewOpen: true,
            })
          }}
          style={{
            marginRight: 3,
          }}
        >
          {label}
        
      
    )
  }
  onDropdownVisibleChange = (open) => {		//展开下拉菜单的回调
    if (open && this.state.relationNewOpen == false) {
      this.setState({
        relationOpen: open,
      })
    } else if (this.state.relationNewOpen == true || open == false) {
      this.setState({
        relationOpen: false,
      })
    } else {
      this.setState({
        relationOpen: open,
      })
    }
  }
render（）{
	const relationdataList = openRelationList.map((item) => {
      return (
        
          {item.InTableFieldNameCN}
        
      )
    })
}

ant :

    
         
	               {relationdataList}
         
	
 

效果图：