Vue+Ele特殊表单校验

一个数组v-for循环渲染form项,限制每一项表单的样式

<ElForm
    :model="form"
     label-width="100px"
     ref="form">
        <ElFormItem
          v-for="(v, k) in form.msg_config"'
          :key="k"
          label="跳转链接"
          :prop="`msg_config[${k}].redirect_url`"
          :rules="[{required: true, message: '请填写跳转链接', trigger: 'blur'}]">
          <ElInput v-model="form.msg_config[k].redirect_url" placeholder="请输入跳转链接"></ElInput>
        </ElFormItem>
</ElForm>

<ElBreadcrumb separator-class="el-icon-arrow-right">
<template v-for="(item, index) in $route.matched">
<ElBreadcrumbItem :key="index">
<span v-if="item.meta && item.meta.isTxt">{{ item.path ? item.meta.title : '首页' }}</span>
<RouterLink v-else :to="item.path || '/'">
{{ item.path ? item.meta.title : '首页' }}
</RouterLink>
</ElBreadcrumbItem>
</template>
</ElBreadcrumb>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 这篇笔记主要包含 Vue 2 不同于 Vue 1 或者特有的内容,还有我对于 Vue 1.0 印象不深的内容。关于...
    云之外阅读 5,180评论 0 29
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 3,155评论 1 4
  • 完整版推荐在线阅读 https://interview2.poetries.top/[https://interv...
    前端进阶之旅阅读 3,666评论 2 20
  • 1.Vue基础语法 Vue 是什么? Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐...
    Scincyc阅读 502评论 0 1
  • 1.安装 可以简单地在页面引入Vue.js作为独立版本,Vue即被注册为全局变量,可以在页面使用了。 如果希望搭建...
    Awey阅读 11,303评论 4 129

友情链接更多精彩内容