vue外包项目开发要求从接口获取ip并渲染在多行文本框内，且每行输入一个ip,保存时要对每行的ip进行校验。

保存时校验代码

ipVerification(e) {
  var type = true
  if (e) {
    if (!/^(([1-9]?\d|1\d{2}|2[0-4]\d|25[0-5])\.){3}([1-9]?\d|1\d{2}|2[0-4]\d|25[0-5])$/.test(e)) {
      type = false
    }
  }
  return type
},
getIp(e) {
  var that = this;
  var isCheck = true
  if (e) {
    var list = e.split(',')
    try {
      list.forEach(function (item, index) {
        if (!that.ipVerification(item)) {
          throw new Error("请输入正确的ip");
        }
      });
    } catch (e) {
      isCheck = false
      that.$message.error(e.message)
    }
  }
  return isCheck
},
save() {
  var that = this
  var newIpAddress = this.newIpAddress.replace(/\n/g, ',')
  if (!this.getIp(newIpAddress)) {
    return
  }
  var data = {newIpAddress: newIpAddress}
  var newData = filterNull(data)
  updateWhiteById(JSON.stringify(newData)).then((res) => {
    if (res.data.code === 0) {
      this.$message({
        message: '更新成功',
        type: 'success'
      })
      this.newIpAddress = ''
      this.getHide()
      this.$emit('getData', 0)
    }
  })
}

获取接口返回的ip并渲染到多行文本框

getShow() {
  this.layerVisible = true
  if (this.list.length > 0) {
    this.newIpAddress = ''
    this.list[0].ip.forEach((type) => {
      this.newIpAddress = this.newIpAddress + type + '\n'
    })
    this.id = this.list[0].id
    console.log(this.newIpAddress)
  } else {
    this.id = ''
  }
},