如何在 vuejs 中的基于类的组件中编写计算设置器

Posted 2023-02-22

【中文标题】如何在 vuejs 中的基于类的组件中编写计算设置器

【英文标题】：how to write computed setters in class-based components in vuejs

【发布时间】：2019-05-21 16:27:45

【问题描述】：

我有下面的计算属性代码。

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

【参考方案1】：

基于类的组件使用 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>

【讨论】：

如何调用set方法？

@farahm this.filterText = value

@farahm 实际上，它应该已经适用于