fix: Downgrade to deepclone when call methods: push、unshift、splice in Vue

Author: wxnet2013

package.json

@@ -35,7 +35,8 @@
   },
   "homepage": "https://talkingdata.github.io/rxloop-immer",
   "dependencies": {
-    "immer": "^1.6.0"
+    "immer": "^1.6.0",
+    "lodash": "^4.17.11"
   },
   "peerDependencies": {
     "@rxloop/core": ">= 0.9.0",

rollup.config.js

@@ -17,6 +17,7 @@ if (env === 'es' || env === 'cjs') {
     nodeResolve({
       jsnext: true
     }),
+    commonjs(),
     babel({
       plugins: ['external-helpers'],
     })

src/index.js

@@ -1,18 +1,32 @@
 import produce from "immer";
+import cloneDeep from 'lodash/fp/cloneDeep';
 
 export default function rxloopImmer() {
   return function init() {
     function createReducer(action = {}, reducer = () => {}) {
       return (state) => {
-        const rtn = produce(state, draft => {
-          const compatiableRet = reducer(draft, action);
-          if (compatiableRet !== undefined) {
-            // which means you are use redux pattern
-            // it's compatiable. https://github.com/mweststrate/immer#returning-data-from-producers
-            return compatiableRet;
+        try {
+          const rtn = produce(state, draft => {
+            const compatiableRet = reducer(draft, action);
+            if (compatiableRet !== undefined) {
+              // which means you are use redux pattern
+              // it's compatiable. https://github.com/mweststrate/immer#returning-data-from-producers
+              return compatiableRet;
+            }
+          });
+          return rtn === undefined ? {} : rtn;
+        } catch(e) {
+          // 在 Vue 下开启 rxloop-immer 插件
+          // 当对数组执行 push、unshift、splice 三个方法时会报错
+          // 这个时候降级为深拷贝方式
+          if(e.toString().indexOf('\'observeArray\' of undefined')) {
+            console.warn('Downgrade to deepclone when call methods: push、unshift、splice in Vue');
+            const draft = cloneDeep(state);
+            reducer(draft, action);
+            return draft;
           }
-        });
-        return rtn === undefined ? {} : rtn;
+          throw e;
+        }
       }
     }
     this.createReducer = createReducer;

yarn.lock

@@ -2683,6 +2683,10 @@ lodash@^4.13.1, lodash@^4.17.10, lodash@^4.17.4, lodash@^4.2.1:
   version "4.17.10"
   resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
 
+lodash@^4.17.11:
+  version "4.17.11"
+  resolved "https://registry.npmjs.org/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d"
+
 loose-envify@^1.0.0:
   version "1.4.0"
   resolved "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"