vue 文本编辑器wangeditor版

<FormItem label="详情描述" label-position="top" prop="activityDescription">
            <br>
            <Editor ref="editor" @on-change="editorChange" v-if='!isSee' ></Editor>
            <p v-html="formData.activityDescription" v-if='isSee'></p>
            <p v-if='isSee && !formData.activityDescription'>暂无信息</p>
</FormItem>

import Editor from '@/components/wangeditor'

// 富文本改变时获取到文字
    editorChange(html, text) {
      const containsImage = this.$refs.editor.getEditor().search(/<img /i) >= 0
      if (containsImage) {
        this.$refs['formValidate'].fields.forEach(function(e) {
          if (e.prop === 'activityDescription') {
            e.resetField()
          }
        })
      }else{
        // this.$handleValidate('formValidate', this).then(valid => {
        //   if (valid) {
        //     this.handleSubmit()
        //   }
        // })
        var desp = this.$refs.editor.getEditor().replace(/<[^>]+>/g, '') // 去除所有的标签
        desp = desp.replace(/&nbsp;/ig, '')
        desp = desp.split('↵').join('')
        if(desp !== '' || desp !== undefined || desp.trim() !== '' || desp !== null || desp !== '<p><br></p>') {
          this.$refs['formValidate'].fields.forEach(function(e) {
            if (e.prop === 'activityDescription') {
              e.resetField()
            }
          })
        }else{
        }
      }
      this.formData.activityDescription = html
    },

详情获取赋值

if(this.$refs.editor) {
     this.$refs.editor.setHtml(info.goodsDescription)
}

重置清空

if(this.$refs.editor) {
   this.$refs.editor.setHtml('')
}

新增

Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致

Object.keys(this.formData).forEach((item, index) => {
        if (!params[item]) {
          if(this.formData[item]) {
            params[item] = ((this.formData[item] || null) + '').trim()
          }else{
            params[item] = null
          }
        }
      })

 

contentDescription: [
      {
        required: true,
        trigger: 'blur',
        validator: (rule, value, callback) => {
          const containsImage = _this.$refs.editor.getEditor().search(/<img /i) >= 0
          if (containsImage) {
            callback()
          }else{
            var desp = _this.$refs.editor.getEditor().replace(/<[^>]+>/g, '') // 去除所有的标签
            desp = desp.replace(/&nbsp;/ig, '')
            desp = desp.split('↵').join('')
            console.log(desp)
            if(desp.trim === '' || desp === undefined || desp.trim() === '' || desp === null || desp === '<p><br></p>') {
              callback(new Error('请输入详情描述'))
            }
          }
          callback()
        }
      }
    ]