Vue-component | 自定义Form组件

日常开发中积累了不少可能对一些开发有帮助的简单易用的组件，好记性不如烂笔头，想对过去的一些零零乱乱的东西做一些总结，反省自己的同时也便于思考一些更优的方法，提升下开发思维???。 代码传送门（?感觉有作用的的同学帮忙点下❤️️） 效果截图 先上效果图，自定义规则，违反规则马上显示提示。 Form 组件结构 参照elementUI的表单组件，组件的结构是Form > ... (FormItem > Form组件) // Form // FormItem // content // ...可以添加多个Item 核心代码 Form组件 最上级是Form组件，是进行全局验证的组件，并且接收prop(传递的数据模型和规则),并将自身注入到子级中。 FormItem组件 用item组件包裹表达内容组件，目的是为了进行单一校验，并产生错误的提示信息。这里使用的是async-validator第三方的校验库，需要额外装载。 Input组件 内容组件，在这里进行内容的监听，上到FormItem进行校验 使用 使用组件就和elementUI一样进行处理即可