Как передать значения из состояния в почтовом запросе vuex
Я собираю данные, используя get и set для моей формы. Я хочу опубликовать состояния в API. Как я могу перемещать состояния или как-то их группировать, чтобы я мог передать их как действие?
state: {
firstname: "",
lastname: "",
},
mutations: {
setFirstName(state, value) {
state.firstname = value
},
setLastName(state, value) {
state.lastname = value
},
Так это выглядит так:
sendInfo({commit}, object) {
axios.post('API_URL', object)
.then((response) => {
...
})
}
computed: {
firstname: {
get() {
return this.$store.state.firstname
},
set(value) {
this.$store.commit("setFirstName", value)
}
},
или я подхожу к этому неправильно?
Ответы 1
Вероятно, лучше всего поместить эти значения в объект состояния, например:
state: {
user: {
firstname: '',
lastname: ''
}
}
Вы можете установить объект в действии
actions: {
setData({ commit }, payload) {
commit('SET_DATA', payload);
}
},
mutations: {
SET_DATA(state, payload) {
state.user = payload;
}
}
Это также делает его кратким при использовании mapState:
computed: {
...mapState(['user'])
}
Нет, с фиксацией тоже все в порядке. Вы бы просто удалили действие из моего ответа и использовали мутацию. Остальное останется прежним. Но ваше редактирование показывает, как вы это сделаете, если захотите изменить отдельные свойства. Мой ответ был на ваш вопрос об изменении их как группы.
Но get/set не только один, у меня их около 5 на разных видах.
Итак, когда я группирую их в состоянии как полезная нагрузка: { }, в мутации я меняю state.firstname = value на state.payload.firstname = value?
Это становится сложнее, когда вы пытаетесь реактивно использовать отдельные значения в такой форме, как ваше редактирование, потому что вам нужен отдельный вычисляемый установщик для каждого из них. Или обходной путь, например клонирование объекта
Так же, как действие в моем ответе
Что, если я передам состояние в качестве параметра, должно ли это работать? postInfo({state}) { axios.post('api_url', { name: state.firstname }) }
Да, если данные уже установлены, но state.user.firstname если на моем примере. Вы также можете сделать это: postInfo({ state }, payload) { axios.post('api_url', { name: payload.firstname })}
Нужно ли действие для установки данных? Я использовал get set для установки состояния многошаговой формы. Я отредактирую свой пост и покажу код для этого.