elementUI 中tag的使用

                        
                            {{tag}}
                        
                        
                            
                            
                            + New Tag
                        
                    
                    
                    var self = this
var validateTags = (rule, value, callback) => {
  if (self.dynamicTags.length <= 1) {
    return callback(new Error('请至少添加两个标签'))
  } else {
    return callback()
  }
}
tags: [
      { validator: validateTags, trigger: ['blur', 'change'] }
    ],
    dynamicTags: [],
    do_save (self) {
  // 获取tag数据
  self.form.tags = self.dynamicTags.join()
  self.axios.post(self.publicPath + '/component/save', self.form).then(function (res) {
    if (res.data.code == 1) {
      self.$message({
        message: res.data.msg,
        type: 'success'
      })
      self.form.id = res.data.data
      setTimeout(self.doCancel, 1000)
    } else {
      self.$message.error(res.data ? res.data.msg : '操作失败')
    }
  }).catch(function (error) {
    console.log(error)
    self.$message.error('网络异常,请稍后再试')
  })
},
handleClose (tag) {
  this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1)
  this.$refs.ruleForm.validateField('tags')
},
showInput () {
  this.inputVisible = true
  this.$nextTick(_ => {
    this.$refs.saveTagInput.$refs.input.focus()
  })
},

defaultAction () {

  let inputValue = this.inputValue
  if (inputValue) {
    this.dynamicTags.push(inputValue)
  }
  this.inputVisible = false
  this.inputValue = ''
},

handleInputConfirm (kind) {

  if (kind == 1) {
    setTimeout(() => {
      this.defaultAction()
    }, 200)
  } else {
    this.defaultAction()
  }
},

.partAdd_tag{

    text-align: left
}
.tag_insert_select{
    width: 150px!important;
}

你可能感兴趣的:(vue.js)