nut-form表单:实现动态新增、校验
nut-form表单:实现动态新增、校验
项目案例背景:
- vue3 + ts + nutui框架
案例截图
- 略
案例代码:
-
如下:
<template><nut-form :model-value="formData" ref="dynamicRefForm"><template v-for="(item, index) in formData.contacts" :key="index"><nut-form-item :label="'联系方式' + index" :prop="'contacts.' + index + '.value'" required:rules="[{ required: true, message: '请填写联系方式' + index }]"><nut-input class="nut-input-text" v-model="item.value" :placeholder="'请输入联系方式' + index"