Estoy usando la API de composición de Vue3 y me gustaría almacenar algunos parámetros de búsqueda en mi tienda.
Mi estado:
const state = () => ({ selection: { selected_cabins: "M", flight_type: "round", adults: 1, children: 0, infants: 0, pets: 0, fly_from: "", fly_to: "", start_date: "", return_date: "", }, });Estoy tratando de usarlo así:
<q-select borderless :options="flightType" v-model="selection.flight_type" option-value="value" emit-value map-options />Propiedad calculada:
const selection = computed({ get() { return store.state.flights.selection; }, set(val) { store.commit("flights/SET_SELECTION", val); }, }); Pero sigo recibiendo el error de que no puedo mutar el estado fuera de una mutation .
Si divido el objeto ( selections ) en sus propiedades, puedo hacer que funcione, pero eso es realmente detallado. ¿Hay alguna forma de hacer lo anterior con un objeto como lo tengo?
En v-model , está accediendo al valor de estado anidado que muta ese estado, la sintaxis correcta debería ser como:
v-model="flight_type"y en el setter esparcir el estado con propiedad modificada:
const flight_type = computed({ get() { return store.state.flights.selection.flight_type; }, set(val) { store.commit("flights/SET_SELECTION", {...store.state.flights.selection,flight_type:val); }, });