programing

Vuex 스토어가 자동으로 업데이트됨

prostudy 2022. 4. 17. 10:01
반응형

Vuex 스토어가 자동으로 업데이트됨

나의Vuex가게 getsautomatically updated아무에게도 전화하지 않고getters또는committing아무 것이나mutation즉시router change.

양식이 저장되기 전에는 VUEX에 대한 변경을 약속하지 않으므로 데이터가 VUEX에 양방향으로 바인딩됨을 의미한다.나는 이것이 불가능하다는 인상을 받았다.이 경우 사용자가 일부 데이터를 변경한 다음 실제로 "저장"을 클릭하지 않고 탐색할 경우 데이터가 VUEX로 변경되므로 원하지 않는다.

<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>

이런 걸 하는 게 좋을 것 같아. 질문으로 이해하니까.v-model…을그렇게 하지 말고 아래의 예를 확인해라.도움이 됐으면 좋겠는데.

참조URL: https://stackoverflow.com/questions/44429951/vuex-store-automatically-updated

반응형