vue computed & setter & getter All In One

vue computed & setter & getter All In One

// ...
computed: {
  fullName: {
    // getter
    get: function () {
      return this.firstName + ' ' + this.lastName
    },
    // setter
    set: function (newValue) {
      var names = newValue.split(' ')
      this.firstName = names[0]
      this.lastName = names[names.length - 1]
    }
  }
}
// ...

https://cn.vuejs.org/v2/guide/computed.html#计算属性的-setter

demo

<el-tabs
            v-model="activeTab"
            class="m-l-20 creative-tab-wrap"
            @tab-click="tabChange">
   ...
</el-tabs>

    computed: {
        // setter & getter
        activeTab () {
            return this.creativeTabType ?? 'STATIC_NOMAL';
            console.log('this.activeTab', this.activeTab);
        },
    },
    mounted () {
        // console.log('init tab', this.creativeTabType);
        // this.activeTab = this.creativeTabType ?? 'STATIC_NOMAL';
    },
    methods: {
        tabChange () {
            console.log('this.activeTab', this.activeTab);
            if (this.activeTab === 'STATIC_NOMAL') {
                this.creative_material_mode = 'STATIC_NOMAL';
            } else {
                // 推荐, new API
                this.creative_material_mode = '';
            }
        },
}

refs

---

---

©xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！

---