객체 확장 연산자 인스턴스를 사용한 vuex에 대한 자세한 설명

사용 시나리오

데이터 상태 관리를 위해 vuex를 사용해야 하는 경우 mapGetters, mapState 및 자체 계산 속성이 사용됩니다. 이번 글에서는 주로 vuex에서 객체 확장 연산자를 사용하는 예제를 소개합니다. 편집자는 꽤 좋다고 생각해서 지금 공유하고 참고용으로 올려드리겠습니다. 편집자를 따라가서 모두에게 도움이 되기를 바랍니다.

1. 먼저

npm install babel-plugin-transform-object-rest-spread -D

2를 설치해야 합니다. .babelrc 파일에 다음

{

 "presets": [

  ["env", { "modules": false }]

 ],

 "plugins": ["transform-object-rest-spread"] //增加这一行

}

를 추가해야 합니다. 3. vue 구성 요소에서

<script>

  import {mapState,mapGetters} from &#39;vuex&#39;

  export default {

    methods:{

      increment(){

        this.$store.commit(&#39;increment&#39;);

      }

    },

    computed:{

      ...mapGetters([

        &#39;count&#39;

      ]),

      ...mapState({

        counts(){

          return this.$store.state.count;

        }

      })

    }

  }

</script>

를 사용합니다. 관련 권장 사항:

연산자 규칙 및 암시적 in JavaScript 유형 변환 예제에 대한 자세한 설명

PHP 삼항 연산자 및 if에 대한 자세한 설명

PHP 개발에서 연산자 사용 소개

위 내용은 객체 확장 연산자 인스턴스를 사용한 vuex에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!