Fixed bug with long state attribute names and array syntax (#7)

Vanilla-IceCream · Mar 20, 2021 · 07c2367 · 07c2367
1 parent 462d143
commit 07c2367
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 10 deletions.
diff --git a/src/index.js b/src/index.js
@@ -40,10 +40,16 @@ export const mapModel = normalizeNamespace((namespace, models) => {
 
         const valify = String(val);
 
-        const originState = valify.substring(
-          valify.indexOf('state.') + 6,
-          valify.indexOf(';') === -1 ? undefined : valify.indexOf(';'),
-        );
+        let originState;
+
+        if (valify.startsWith('state.')) {
+          originState = valify.substring(
+            valify.indexOf('state.') + 6,
+            valify.indexOf(';') === -1 ? undefined : valify.indexOf(';'),
+          );
+        } else {
+          originState = valify.substring(valify.indexOf('.') + 1, valify.indexOf(';'));
+        }
 
         this.$store.commit(type, { label: originState || key, value });
       },

diff --git a/test/test.js b/test/test.js
@@ -129,11 +129,11 @@ describe('vuex-bound', () => {
       const Component = {
         template: `
           <div>
-            <input v-model="foo"> {{ foo }}
+            <input v-model="fooBarBaz"> {{ fooBarBaz }}
           </div>
         `,
         computed: {
-          ...mapModel('a/b', ['foo']),
+          ...mapModel('a/b', ['fooBarBaz']),
         },
       };
 
@@ -144,7 +144,7 @@ describe('vuex-bound', () => {
             modules: {
               b: {
                 namespaced: true,
-                state: { foo: 'foo' },
+                state: { fooBarBaz: 'foo' },
                 mutations: { ...updateModel() },
               },
             },
@@ -155,11 +155,11 @@ describe('vuex-bound', () => {
       const wrapper = shallowMount(Component, { localVue, store });
 
       expect(wrapper.html()).toMatchSnapshot();
-      expect(store.state.a.b.foo).toMatch('foo');
+      expect(store.state.a.b.fooBarBaz).toMatch('foo');
 
-      wrapper.setData({ foo: 'bar' });
+      wrapper.setData({ fooBarBaz: 'bar' });
       expect(wrapper.html()).toMatchSnapshot();
-      expect(store.state.a.b.foo).toMatch('bar');
+      expect(store.state.a.b.fooBarBaz).toMatch('bar');
     });
 
     it('should handle object', () => {