zoukankan      html  css  js  c++  java
  • vue element-ui 通过v-for渲染的el-form-item组件,使用自带的表单验证

    HTML:

    <el-form ref="newTermDetail" :model="newTermDetail" class="auto_form">
                <div :style="operation =='new' ? 'margin-left: 50px' : 'margin-left: 20px'">
                    <el-form-item 
                        v-for="(domain, index) in newTermDetail.questions"
                        :label="operation == 'new' ? ' ' : '' + domain.id"
                        :key="'term' + index"
                        :prop="'questions.' + index + '.s_question'"
                        :style="index == 0 ? 'margin-top: 0; margin-bottom: 20px;' : 'margin: 20px auto;'"
                        :rules="[{ required: true, validator: checkInputValid, message: '请输入中英文', trigger: ['blur','change'] }]">
                        <el-input style=" 300px;" type="textarea" autosize v-model="domain.s_question"></el-input>
                        <el-button @click.prevent="removeTermDomain(domain, index)">删除</el-button>
                    </el-form-item>
                </div>
        </el-form>

    js data:

      data() {
        let checkInput = (rules, value, callback) => {
          const regex = new RegExp("^([u4E00-uFA29]|[uE7C7-uE7F3]|[a-zA-Z ]|[,、?。!,?.!])+$");
          if(!regex.test(value) || !value) {
            callback(new Error('请输入中英文语句'));
          }else {
            callback();
          }
      }
        return {
            checkInputValid: checkInput,
            newTermDetail: {
                questions: [
                { s_question: ''}, 
                { s_question: ''}
                ]
            }
        };
      },

    推荐网址:https://blog.csdn.net/uncle_long/article/details/80257389

  • 相关阅读:
    tty & pty & pts
    PageRank
    How to run a terminal inside of vim?
    vimdiff
    svn's tree conflict
    svn's diff command
    符号表分离
    gcc -D
    Options for Debugging Your Program or GCC
    invoking gdb
  • 原文地址:https://www.cnblogs.com/zhaomeizi/p/9909822.html
Copyright © 2011-2022 走看看