<el-form :model="form" :rules="rules" ref="form">

    <el-form-item label="原因描述" prop="reasonDesc" v-show="sybFlag">
        <div ref="reasonDesc"  contenteditable="true"></div>
    </el-form-item>

    <el-form-item label="功能描述" prop="functionDesc" v-show="!sybFlag">
        <div ref="functionDesc" contenteditable="true"></div>
    </el-form-item>

    <el-button type="primary" @click="submitBtn">提交</el-button>

</el-form>

export default {
    data(){
        let reasonDescRule = (rule, value, callback) => {
            if(this.sybFlag){
                if(value == ''){
                    callback(new Error("請(qǐng)輸入原因描述"));
                }else{
                    callback();
                }
            }else{
                callback();
            }
        };
        let functionDescRule = (rule, value, callback) => {
            if(!this.sybFlag){
                if(value == ''){
                    callback(new Error("請(qǐng)輸入功能描述"));
                }else{
                    callback();
                }
            }else{
                callback();
            }
        };
        return {
            form: {
                reasonDesc: '',
                functionDesc: '',
                sybFlag: true
            },
            rules: {
                reasonDesc:[
                    { required: true, validator: reasonDescRule }
                ],
                functionDesc:[
                    { required: true, validator: functionDescRule }
                ]
            }
        }
    },
    methods: {
        submitBtn(){
            // 在提交之前先對(duì)表單自定義元素賦值，然后在進(jìn)行驗(yàn)證操作
            this.form.reasonDesc = this.$refs.reasonDesc.target.innerHtml;
            this.form.reasonDesc = this.$refs.functionDesc.target.innerHtml;

            this.$refs.form.validate((valid) => {
                if (valid) {
                    alert('submit!');
                } else {
                    console.log('error submit!!');
                    return false;
                }
            })
        }
    }
}
<style lang="scss" scoped>
    // 設(shè)置驗(yàn)證不通過(guò)時(shí)，邊框?yàn)榧t色
    .el-form-item.is-error .w-e-toolbar{
        border-color: #F56C6C !important;
    }
    .el-form-item.is-error .w-e-text-container{
        border-color: #F56C6C !important;
    }
</style>