[vee-validate] 组件间同步验证

--- 本文开始 ---
最近在设计时，因为一个 Vue 档的template 有太多的 form ，都挤在同一个 vue 档中，想说之后应该很难管理。
所以就开始研究如将所有的 Form 分类成各个小组件，也方便管理。

如个每个 Form 你有再用 Vuex 的话，在 computed 里面，又会多出 get&set 如图

10个 form 就会有10个，所以就想要分别提出，为每个小组件

官网相关说明

首先，我们在父层的methods 还是一样有个 createItem ，代表当有个新增按钮，按下执行 createItem 的方法
方法中，写入验证

/** * 新增 * @param {Object} model * @param {Object} vuex * @param {Object} routersName */createItem(model, vuex, routersName) {    this.$validator.validateAll().then((result) => {        if (result) {            // 验证成功后做些什么！！            return;        }        this.createErrorMessage();    });},

然后我们将 Form 分别放到各个子组件中
在 script 中，加入

export default {    $_veeValidate: {        validator: 'new'    },    inject       : ['$validator'],}

这样就好了吗！颗颗~~~我原来也是这样认为，其实还要改 vee-validate 的 config ，红圈处加入 inject: false，这样就大功告成

const config = {    locale: 'zh_TW',    inject: false};Vue.use(VeeValidate, config);

以上处理，就可以将各 form 表组件化，由同步验证去处理了~~~

--- 相关连结 ---
--- 更多的文章 在痞客邦 ----
痞客邦

感谢

感谢各位的观看！
友情连结：钻头-瑜诚
文中如有技术不良或写错的部份，如您愿意指出，我们也很乐意接受您的指正，但请不要恶意攻撃，我们只是为了乐趣而写的文章。