在 html 模板中使用计算属性之前，如何在计算属性中操作 Getter？

【问题标题】：How do I manipulate Getters in computed property before using it in the html template?在 html 模板中使用计算属性之前，如何在计算属性中操作 Getter？
【发布时间】：2019-04-23 21:23:37
【问题描述】：

我将 Vuex 存储中的 getter 映射为计算属性，并希望在组件模板中使用该属性（它的对象数组）之前对其进行操作。知道我该怎么做吗？

我试过查看计算的属性，但是没有用。

import {mapGetters} from 'vuex
computed: {
  ...mapGetters([
   'property'
    ])
}

【问题讨论】：

标签： vue.js vuex

【解决方案1】：

您可以在另一个自定义属性中使用您的 getter，就像对简单变量所做的那样：

<template>
  <div>
    <div v-for="item in transformedItems" :key="item">{{item}}</div>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  computed: {
    ...mapGetters(['items']),
    transformedItems() {
      return this.items.map(item => item.name)
    }
  }
}
</script>

然后你可以在你的模板中使用transformedItems

【讨论】：

啊，我不敢相信我没有想到这一点。感谢您的帮助！
有时您只需要基于同事的旧代码使用您从未使用过的框架交付项目。然后像这样的问答可以挽救生命。 @HamidMian 您仍然可以接受答案。