source

계산된 속성 업데이트 후 함수를 실행하는 가장 좋은 방법

gigabyte 2022. 9. 16. 23:08
반응형

계산된 속성 업데이트 후 함수를 실행하는 가장 좋은 방법

현재 Vuex 스토어에서 업데이트하는 계산된 속성을 가진 구성 요소가 있습니다.이 부분은 완벽하게 작동한다.제가 혼란스러운 것은 일단 계산된 속성 업데이트가 이루어지면, 저는 항상 제 뷰에 맞게 데이터를 조정해야 한다는 것입니다.이것을 달성하는 가장 좋은 방법은 무엇입니까?

예를 들어 다음과 같습니다.

내 컴포넌트는 다음과 같습니다.

    computed: {
        players: function() {
            return this.$store.state.players;
        },

나는 이전에 기능이 있었다.setupPlayers(data)이 정보를 수정하여 뷰에 제공했습니다.

지금 궁금한 것은 컴퓨터 플레이어가 변경되면 뷰에 맞게 데이터를 조정하는 기능을 실행하고 싶다는 것입니다.이거 어떻게 해?아니면 잘못된 접근 방식입니까?

계산된 속성을 업데이트하고 있는 데이터를 만들고, 이 속성은 다음 항목에 따라 달라야 합니다.players계산된 속성:

computed: {
  players: function() {
    return this.$store.state.players;
  },
  myData: function() { // will update automatically whenever this.players changes
    var players = this.players;
    // do something players data
  }
}

어떤 이유로든 해당 데이터를 계산된 속성으로 만들 수 없는 경우에는 워처를 사용할 수도 있습니다.

watch: {
  players: function(value) {
    // update your data
  }
}

여기에는 2가지 접근법이 있습니다.

  1. 주정부에서 직접 데이터에 액세스하지 말고 Getter를 통해 데이터에 액세스하면 데이터를 반환하기 전에 Getter가 데이터를 조작할 수 있습니다.
  2. 비동기 또는 무거운 작업을 수행하지 않는 한 계산 속성의 모든 로직을 반환하기 전에 실행할 수 있습니다.따라서 계산 속성의 플레이어 어레이를 조작하기만 하면 됩니다.

    computed: {
        players: function() {
            var players = this.$store.state.players;
            //do something here
            ....
            return players;
        },
    

언급URL : https://stackoverflow.com/questions/46282229/best-way-to-execute-function-once-computed-property-updates

반응형