Vuex Shop automatisch aktualisiert

Question

Mein Vuex Speicher automatically updated bekommt, ohne dass getters oder committing jede mutation auf sofortige router change aufrufen.

Ich übergebe keine Änderungen an VUEX, bis das Formular gespeichert wird, also bedeutet es, dass die Daten in zwei Richtungen an VUEX gebunden sind. Ich hatte den Eindruck, dass dies nicht möglich war. In diesem Fall ist es nicht erwünscht, da, wenn der Benutzer einige Daten ändert, navigiert dann weg, ohne tatsächlich Klick auf „Speichern“ ist die Daten VUEX noch

geändert wird

Answer 1

<template> 
    <h1>{{userName}}</h1> 
    <input type="text" v-model="name.selected" :placeholder="user.username" @keyup.enter="Confirm"/> 
</template> 

<script> 
    import { mapGetters } from 'vuex' 
    import { updateUserData } from 'mesh-shared/api/' 
    export default { 
    name: 'PreferenceProfile', 
    data() { 
     return { 
     name: { 
      isActive: false, 
      selected: '', 
      onChange: false 
     } 
     } 
    }, 
    computed: { 
     ...mapGetters([ 
     'user', 
     'preference' 
     ]), 
     userName() { 
     if (this.name.selected !== '') { 
      return this.name.selected 
     } else { 
      return this.user.username 
     } 
     } 
    }, 
    methods: { 
     toggleNameRider() { 
     this.name.isActive = true 
     }, 
     async Confirm() { 
     const params = { 
      userId: this.user.userId, 
      accessToken: this.user.auth.accessToken, 
      avatar: (this.avatar.uploadData.url) ? this.avatar.uploadData.url : this.user.avatar, 
      username: this.userName 
     } 
     const data = await updateUserData(params) 
     console.log(data) 
     const user = Object.assign(this.user, { 
      completed: true 
     }, data.data.user) 
     this.cancel() 
     }, 
     cancel() { 
     this.avatar.newUrl = '' 
     this.name.selected = '' 
     this.name.isActive = false 
     } 
    } 
    } 
</script> 

ich Ihnen empfehlen, so etwas zu tun. Wie ich von deiner Frage verstehe, stellst du v-model auf Getter. statt dies zu tun, überprüfen Sie das Beispiel unten. Ich hoffe, es kann helfen.