通过 properties 添加 dirty 属性让开发者控制是否需要脏检查，解决 mpvue 下循环渲染的问题

添加 dirty 属性启用脏检查，默认关闭状态。由于 mpvue 机制的原因，更新了 data 中的一个数据会导致了全部 data 数据都被刷新，从而触发 Painter 重绘。已使用 https://github.com/epoberezkin/fast-deep-equal 这个短小精悍的库进行了脏检查，mpvue 开发者可使用 dirty 属性来避免循环渲染的问题

lib/util.js

@@ -3,7 +3,65 @@ function isValidUrl(url) {
   return /(ht|f)tp(s?):\/\/([^ \\/]*\.)+[^ \\/]*(:[0-9]+)?\/?/.test(url);
 }
 
+/**
+ * 深度对比两个对象是否一致
+ * from: https://github.com/epoberezkin/fast-deep-equal
+ * @param  {Object} a 对象a
+ * @param  {Object} b 对象b
+ * @return {Boolean}   是否相同
+ */
+function equal(a, b) {
+  if (a === b) return true;
+
+  if (a && b && typeof a == 'object' && typeof b == 'object') {
+    var arrA = Array.isArray(a)
+      , arrB = Array.isArray(b)
+      , i
+      , length
+      , key;
+
+    if (arrA && arrB) {
+      length = a.length;
+      if (length != b.length) return false;
+      for (i = length; i-- !== 0;)
+        if (!equal(a[i], b[i])) return false;
+      return true;
+    }
+
+    if (arrA != arrB) return false;
+
+    var dateA = a instanceof Date
+      , dateB = b instanceof Date;
+    if (dateA != dateB) return false;
+    if (dateA && dateB) return a.getTime() == b.getTime();
+
+    var regexpA = a instanceof RegExp
+      , regexpB = b instanceof RegExp;
+    if (regexpA != regexpB) return false;
+    if (regexpA && regexpB) return a.toString() == b.toString();
+
+    var keys = Object.keys(a);
+    length = keys.length;
+
+    if (length !== Object.keys(b).length)
+      return false;
+
+    for (i = length; i-- !== 0;)
+      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
+
+    for (i = length; i-- !== 0;) {
+      key = keys[i];
+      if (!equal(a[key], b[key])) return false;
+    }
+
+    return true;
+  }
+
+  return a!==a && b!==b;
+}
+
 module.exports = {
   isValidUrl,
+  equal
 };
 

painter.js

@@ -27,6 +27,11 @@ Component({
         }
       },
     },
+    // 启用脏检查，默认 false
+    dirty: {
+      type: Boolean,
+      value: false
+    }
   },
 
   data: {
@@ -52,7 +57,7 @@ Component({
     },
 
     isNeedRefresh(newVal, oldVal) {
-      if (!newVal || this.isEmpty(newVal)) {
+      if (!newVal || this.isEmpty(newVal) || (this.data.dirty && util.equal(newVal, oldVal))) {
         return false;
       }
       return true;