0
170
VistasVUEJS: Componente para actualizar la preferencia de comunicación de un usuario
Solo necesito ayuda para identificar lo que me estoy perdiendo aquí. Simplemente parece que no puede enviar los datos correctos a través de:
Padre con el componente CommunicationPreference:
<CommunicationPreference v-for="(communication, index) in communicationPreference" :key="index" :consent="communication.consent" :name="communication.name" @update="updateConsent(consent)" />MÉTODO
methods: { async updateConsent(consent) { await this.$store.dispatch('account/updateCommunicationPreferences', { consent }) }, },ComunicaciónPreferencia.vue
<Button class="mr-4" :text="YES" :type="consent === true ? 'primary' : 'secondary'" @clicked="updateConsent(true)" /> <Button :text="NO" :type="consent !== true ? 'primary' : 'secondary'" @clicked="updateConsent(false)" />ACCESORIOS:
props: { type: { type: String, default: '', }, name: { type: String, default: '', }, consent: { type: Boolean, default: true, }, },MÉTODO:
updateConsent(consent) { this.$emit('update', consent) },TIENDA:
async updateCommunicationPreferences({ commit, state }, payload) { const { consent } = payload const { communicationTypeName } = state.communicationTypeName try { const response = await this.$axios.put(`/communication-consent/${communicationTypeName}`, consent) const { data: updatedCommunicationPreferences } = response.data commit('SET_UPDATED_COMMUNICATION_PREFERENCES', updatedCommunicationPreferences) } catch (error) { commit('ADD_ERROR', { id: 'updateCommunicationPreferences', error }, { root: true }) } },Se adjunta la interfaz de usuario en la que estoy trabajando como referencia. la idea es que cada vez que el usuario seleccione SÍ o NO, la selección se actualice y se refleje en la interfaz de usuario
Aquí está mi documento de Swagger:
1 Respuestas
Responde la pregunta0
Supongo que tiene un captador mapeado para communicationPreference Preferencia prop, por lo que esto es correcto. También asumo que su accesorio de evento @clicked es adecuado siempre que se implemente Button.vue.
Así que intente cambiar @update="updateConsent(consent)" a @update="updateConsent"
En este momento me parece que estás cometiendo un pequeño error entre una llamada de función y una declaración. Tenerlo como @update="updateConsent" activará el método updateConsent y la declaración de la función:
async updateConsent(consent) { await this.$store.dispatch('account/updateCommunicationPreferences', { consent }) },se encargará de obtener el consentimiento que pases en el activador de tu evento.