表单中某一项点击添加和删除

白马？定叫他有来无回！

于 2023-09-28 16:04:56 发布

阅读量109

点赞数

文章标签： vue.js elementui javascript

本文链接：https://blog.csdn.net/qq_33138785/article/details/133385728

版权

<!-- 特殊表单 -->
        <div v-for="(item, index) in form.fwzb" :key="index+'fwzb'" style="height: 102px">
          <el-form-item label="经度：" class="form-style"
            :prop="'fwzb.' + index + '.lon'"
            :rules="[
              {required: true, message: '经度不能为空', trigger: 'blur'},
            ]"
          >
            <el-input v-model="item.lon" size="small" class="special-style" />
          </el-form-item>
          <el-form-item label="纬度：" class="form-style"
            :prop="'fwzb.' + index + '.lat'"
            :rules="[
              {required: true, message: '纬度不能为空', trigger: 'blur'},
            ]"
          >
            <el-input v-model="item.lat" size="small" class="special-style" />
            <el-button v-if="index+1 == form.fwzb.length" type="primary" size="mini" @click="addItem(form.fwzb.length)">+</el-button>
            <el-button v-if="index !== 0" type="danger" size="mini" @click="deleteItem(item, index)">-</el-button>
          </el-form-item>
        </div>