Связывание предварительно загруженных данных vuex с динамическим vuetify v-select - PullRequest
Новая
       6

Связывание предварительно загруженных данных vuex с динамическим vuetify v-select

0 голосов
/ 28 декабря 2018

Я использую VueJS 2.x и Vueitfy.

Сценарий: у меня есть два поля выбора, штат и город.На основе состояния, список городов выбирается.Пример: если вы выберете Каранатака, все города Карнатаки будут выбраны во втором окне выбора.Для простоты назовем их stateSelect и citySelect.Я запускаю событие onChange для stateSelect и вызываю функцию выборки городов.У меня есть двустороннее связывание с моим хранилищем Vuex с использованием вычисляемого свойства. 

//store
export default new Vuex.Store({
   state: {
       mState: '',
       mCity: ''
   },
   mutations: {
        setState(state, mState){
            state.mState = mState;
        },
        setCity(state, mCity){
            state.mCity = mCity;
        },
   }
})

//component
computed: {
     state: {
         get(){
            return this.$store.state.mState;
         },
         set(val){
            this.$store.commit('saveState', val);
         }
     },
     city: {
         get(){
            return this.$store.state.mCity;
         },
         set(val){
            this.$store.commit('saveCity', val);
         }
     },
}

data(){
    return {
        states: [],
        cities: []
    }
}

methods: (
    getStates(), //fetches the list of states on mount
    getCities(stateId){
        //fetch cities based on selected state and convert it to a supported format
        this.cities = helpers.createSelectObj(response.data); //response is coming from an XHR request
    }
)

Проблема: Поскольку я использую двустороннее связывание, любое изменение выбора обновляет Vuex, как и ожидалось.Но когда в Vuex уже есть данные, например, если вы отойдете от компонента и вернетесь позже, поле состояния будет выбрано автоматически, но город не будет выбран.Вместо этого mCity в Vuex автоматически обнуляется.

Желаемый результат: после выбора состояния города должны быть выбраны (как это уже происходит), но при переходе от компонента и возвращении к нему,штат и город выбираются автоматически.

Спасибо

...