0

В Vuex есть стейт вида

state: {
  messageUserName: '',
  messageUserEmail: '',
  messageUserPhone: '',
  messageTitleVal: '',
  messageTextVal: '',
},

и мутаторы вида

mutations: {
  setMessageUserName: (state, messageUserName) => 
    state.messageUserName = messageUserName,

Как написать мутатор, пробегающийся по стейту и приводящие его значения к пустой строке ?

1 ответ 1

0

Для плоского объекта состояния (как в вопросе):

const store = new Vuex.Store({
  state: {
    messageUserName: 'a',
    messageUserEmail: 'b',
    messageUserPhone: 'c',
    messageTitleVal: 'd',
    messageTextVal: 'e',
  },
  mutations: {
    TO_EMPTY_STRING(state, fields = []) {
      if (!fields.length)
        fields = Object.keys(state); 
      fields.forEach(k => state[k] = ''); 
    }
  }, 
}); 

console.log(store.state); 
store.commit('TO_EMPTY_STRING'); 
console.log(store.state); 
<script src="https://unpkg.com/vue/dist/vue.min.js"></script> 
<script src="https://unpkg.com/vuex/dist/vuex.min.js"></script> 

Если же целевые свойства будут вложены, то потребуется немного простой рекурсии по объектам (которую лучше реализовать локальной хелпер-функцией в той же мутации).

1
  • Осторожнее с аргументом fields - если в состоянии не окажется указанного свойства, оно создастся нереактивным. Можно было бы использовать Vue.set, но это создает соблазн инициализировать состояние мутацией (очень плохая практика)... если нет доверия к вызывающему коду, то лучше уж дополнительная проверка через hasOwnProperty или сравнением типа с undefined.
    – yar85
    30 дек 2019 в 4:20

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.