2016-09-14 25 views
3

我的vuex商店存在問題。我使用vue2和vuex2。Vuex在調度動作時更改了2個狀態元素

當我發送某個動作時,它會在我的商店中更改2個元素的狀態。 這是我的國家的一部分,它與一些假數據的影響來解釋:

{ 
    "clients":[ 
     { 
      "user":{ 
       "id":7, 
       "name":"Luis", 
       "lastName":"Cervantes", 
       "lastName2":"", 
       "isCompany":0, 
       "razonSocial":null, 
       "cif":"", 
       "documentType":"NIE", 
       "document":"asdasd", 
       "phone":"232344455", 
       "phone2":"", 
       "email":"[email protected]", 
       "active":0, 
       "setPassword":0, 
       "setEmail":1, 
       "active_token":null, 
       "last_login":"2016-09-08 15:57:09", 
       "created_at":"2016-09-08 15:57:09", 
       "updated_at":"2016-09-12 22:05:36" 
      }, 
      "addresses":[ 
       { 
       "id":5, 
       "user_id":7, 
       "province":"Almería", 
       "city":"Almeria", 
       "postCode":"23000", 
       "streetType":"Calle", 
       "address":"Riudoms", 
       "number":"44", 
       "other":"", 
       "address_id":2, 
       "created_at":"2016-09-12 22:02:13", 
       "updated_at":"2016-09-12 22:05:58", 
       "default":1 
       }, 
       { 
       "id":3, 
       "user_id":7, 
       "province":"Araba/Álava", 
       "city":"Alava", 
       "postCode":"23232", 
       "streetType":"Camino", 
       "address":"nueva", 
       "number":"2323", 
       "other":"", 
       "address_id":1, 
       "created_at":"2016-09-08 15:57:09", 
       "updated_at":"2016-09-13 17:28:30", 
       "default":0 
       } 
      ] 
     }, 
     { 
      "user":{ 
       "id":8, 
       "name":"Richard", 
       "lastName":"Czyrny", 
       "lastName2":"", 
       "isCompany":0, 
       "razonSocial":null, 
       "cif":"", 
       "documentType":"NIE", 
       "document":"x84445556V", 
       "phone":"937444566", 
       "phone2":"", 
       "email":"[email protected]", 
       "active":0, 
       "setPassword":0, 
       "setEmail":1, 
       "active_token":null, 
       "last_login":"2016-09-08 15:58:07", 
       "created_at":"2016-09-08 15:58:07", 
       "updated_at":"2016-09-12 20:11:28" 
      }, 
      "addresses":[ 
       { 
       "id":4, 
       "user_id":8, 
       "province":"Tarragona", 
       "city":"Salou", 
       "postCode":"43840", 
       "streetType":"Carretera", 
       "address":"Costa", 
       "number":"35", 
       "other":"1 2", 
       "address_id":3, 
       "created_at":"2016-09-12 21:30:46", 
       "updated_at":"2016-09-13 16:30:10", 
       "default":1 
       } 
      ] 
     } 
    ], 
    "client":{ 
      "user":{ 
       "id":7, 
       "name":"Luis", 
       "lastName":"Cervantes", 
       "lastName2":"", 
       "isCompany":0, 
       "razonSocial":null, 
       "cif":"", 
       "documentType":"NIE", 
       "document":"asdasd", 
       "phone":"232344455", 
       "phone2":"", 
       "email":"[email protected]il.com", 
       "active":0, 
       "setPassword":0, 
       "setEmail":1, 
       "active_token":null, 
       "last_login":"2016-09-08 15:57:09", 
       "created_at":"2016-09-08 15:57:09", 
       "updated_at":"2016-09-12 22:05:36" 
      }, 
      "addresses":[ 
       { 
       "id":5, 
       "user_id":7, 
       "province":"Almería", 
       "city":"Almeria", 
       "postCode":"23000", 
       "streetType":"Calle", 
       "address":"Riudoms", 
       "number":"44", 
       "other":"", 
       "address_id":2, 
       "created_at":"2016-09-12 22:02:13", 
       "updated_at":"2016-09-12 22:05:58", 
       "default":1 
       }, 
       { 
       "id":3, 
       "user_id":7, 
       "province":"Araba/Álava", 
       "city":"Alava", 
       "postCode":"23232", 
       "streetType":"Camino", 
       "address":"nueva", 
       "number":"2323", 
       "other":"", 
       "address_id":1, 
       "created_at":"2016-09-08 15:57:09", 
       "updated_at":"2016-09-13 17:28:30", 
       "default":0 
       } 
      ] 
     }, 
    } 

客戶陣列。

客戶端包含當前選定客戶端的對象。 我有行動改變客戶用戶對象和地址分別對象

操作
SET_CLIENT_PROFILE_USER: ({commit, state}, user) => { 
    commit('CLIENT_PROFILE_USER', user) 
}, 

SET_CLIENT_PROFILE_ADDRESSES: ({commit, state}, addresses) => { 
    commit('CLIENT_PROFILE_ADDRESSES', addresses) 
} 

突變
'CLIENT_PROFILE_USER': (state, user) => { 
    state.client.user = user 
}, 
'CLIENT_PROFILE_ADDRESSES': (state, addresses) => { 
    state.client.addresses = addresses 
} 

這是即時通訊使用一個部件內的一些計算propieties。

clientsList(){ 
    return this.$store.getters.getClients 
}, 
client(){ 
    return this.clientsList[this.client_index] 
}, 
addresses(){ 
    if(this.client){ 
    return this.client.addresses 
    }else{ 
    return '' 
    } 
}, 
address(){ 
if(this.addresses){ 
    return this.client.addresses[this.address_index] 
    }else{ 
    return '' 
    } 
}, 

,這是一些觀察家認爲我使用他們派遣行動

watch: { 
    'client_index': function (val, oldVal) { 
    var c = this.client; 
    // console.log(c) 
    this.$store.dispatch('SET_CLIENT_PROFILE', c); 
    this.address_index = ''; 
    }, 
    'address_index': function(val, oldVal){ 
    if(this.val != ''){ 
     var a = this.address; 
     // console.log(a) 
     this.$store.dispatch('SET_CLIENT_PROFILE_ADDRESSES', a); 
    } 
    } 
}, 

SET_CLIENT_PROFILE_ADDRESSES被分派改變地址client.addreses並在客戶端對應於該地址的對象。 它應該只改變客戶端地址部分。

我找不到爲什麼要這樣做。

我只是想改變client.adresses

回答

1

我發現它是不是值對象和數組按引用傳遞同一個對象,JavaScript的默認行爲。

而我使用Lodash的cloneDeep函數。