vuejs의 클래스 기반 구성 요소에 계산된 세터를 작성하는 방법

vuejs의 클래스 기반 구성 요소에 계산된 세터를 작성하는 방법

계산된 속성에 대한 아래 코드가 있습니다.

computed: {
  filterText: {
    get() {
      return this.filter; // it's a vuex state
    },
    set(value) {
      this.setFilter(value); // it's a vuex action
    }
  }
}

이제 클래스 기반 컴포넌트로 작성하겠습니다.생각합니다getter이렇게 해야 되는데 어떻게 쓰는지는setter?

get filterText() {
  return this.filter
}

클래스 기반 컴포넌트 사용get그리고.set계산된 속성의 경우:

get filterText() {
  return this.filter
}

set filterText(value) {
  this.filter = value
}

TypeScript로 작성된 단일 파일 구성 요소는 다음과 같이 구성됩니다.

<script lang="ts">
  import { Component, Vue } from 'vue-property-decorator'

  @Component
  export default class MyClass extends Vue {
    private filter: string = ''

    public get filterText(): string {
      return this.filter
    }

    public set filterText(filter: string) {
      this.filter = filter
    }
  }
</script>

언급URL : https://stackoverflow.com/questions/53880717/how-to-write-computed-setters-in-class-based-components-in-vuejs