Vue深坑Mark

这是两个不会报错，但会引发千奇百怪异常现象的问题

一、嵌套判断

父组件 v-if=‘属性A’
子组件 v-if=‘属性B’

这是逻辑死循环，因为判断 属性B 时，属性A 有可能已经发生了变化

可以使用计算属性computed

C(){
	return A && B
}

二、赋值回路

this.form.A = 运算(this.form.B)
this.form.B = 运算(this.form.A)

这是逻辑死循环，虽然不清楚Vue内部如何实现的，但是就现象来分析，应该是在绑定值之间会建立逻辑关系

这里可以使用局部变量运算然后将结果赋值给绑定变量

～～～～～～～～～～～～～～～～～分界线～～～～～～～～～～～～～～～～～

值得注意的是：
Promise存在超时无法拿到结果的情况，所以经常会有表单校验不提示校验失败结果，却也通不过的情况

校验嵌套

    A字段: [
    /**
    *应替换为 {validator: 具体的B校验方法}
    * const validateA = (rule, value, callback) => {
    *   _this.$refs.form.validateField('B');
    *   return callback();
    * }
    * {validator: validateA}
    * 两相对比，可以发现，死循环产生的原因是因为：
    * 箭头表达式的最终返回依赖于B的校验结果
    * 而换成validateA之后则消除了这种关系
    **/
      {validator: ()=> _this.$refs.form.validateField('B字段')}
      ]
   这个校验会在提交表单校验时
   this.$refs.form.validate((valid) => {
   	// 校验超时，这里取不到校验结果
   });

反复校验B字段多次（调试结果，原理不明，盲猜是因为每校验一个字段，表单都会整体赋值一次，然后校验次数与表单字段总数成正比）
因此造成校验超时，所以无法拿到校验结果，所以校验不通过。

证明

我在调试时，大断点，整个调试过程超过三分钟（这个时间应该是与字段总量有关的）会成功，如果不打断点或者断点放的过快，都不会成功。