vue.js

关注公众号 jb51net

关闭
首页 > 网络编程 > JavaScript > javascript类库 > vue.js > vue表格n-form必填星号

vue表格n-form中自定义增加必填星号的实现代码

作者:番茄小酱001

这篇文章主要介绍了vue表格n-form中自定义增加必填星号,本文通过实例代码给大家介绍的非常详细,需要的朋友可以参考下

【如上图所示】:自定义增加星号样式

【思路】: 通过插槽实现

【代码】:通过vue的插槽实现自定义样式

 
 <n-form-item-gi label="提示函正文" path="fileList" :span="12">
              <template #label>
                <div>
                  提示函正文
                  <span class="text-[red]">*</span>
                </div>
              </template>
 </n-form-item-gi>

其他通过rules的校验规则如下:

<n-form
    ref="addFormRef"
    :model="state.add"
    :rules="addFormRules"
     label-placement="top"
    require-mark-placement="right"
>
 <n-form-item-gi label="XXX" path="demo" :span="12"></n-form-item-gi>
</ n-form>
//  js语法
const addFormRules = ref<FormRules>({
  demo: {
    required: true,
    message: '请输入XXX',
    trigger: ['input', 'blur'],
  },
})

到此这篇关于vue表格n-form中自定义增加必填星号的文章就介绍到这了,更多相关vue表格n-form必填星号内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

您可能感兴趣的文章:
阅读全文