vue table增删改查input框之校验必填项

最新推荐文章于 2024-08-23 11:40:03 发布

六道轮回 -- 鼬

最新推荐文章于 2024-08-23 11:40:03 发布

阅读量1.5k

点赞数 2

分类专栏：前端

本文链接：https://blog.csdn.net/mirabellezwh/article/details/117324819

版权

本文介绍如何在Vue中实现表格的增删改查功能，并着重讲解了针对input框的必填项验证方法，确保数据完整性和用户体验。

摘要由CSDN通过智能技术生成

在这里插入图片描述

          <el-form :model="testForm" ref="testForm" :rules="testFormRules" label-width="100px" :inline="true">

            <el-form-item label="属性组名：" prop="testFormGroupName">
              <el-input placeholder="请输入内容" v-model="testForm.testFormGroupName" maxlength="32"></el-input>
            </el-form-item>

            <el-form-item label="组标识符：" prop="testFormQualifier">
              <el-input placeholder="请输入内容" v-model="testForm.testFormQualifier" maxlength="32"></el-input>
            </el-form-item>

            <el-form-item label="组类型：" prop="testFormType">
              <el-select v-model="testForm.testFormType" placeholder="请选择" @change="getMoreGroupTypeValue">
                <el-option v-for="item in groupTypeTable" :key="item.value" :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </el-form-item>
          </el-form>

          <!--新增属性组弹框---table-->
          <div class="div-card" style="background-color: #f2f2f2;">
            <div class="div-card">
              <template>

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

                  <el-table ref