为什么getter不返回值答案

【问题标题】：Why does getter not return the value为什么getter不返回值
【发布时间】：2018-11-23 06:13:28
【问题描述】：

我有一个返回对象数组的 getter。问题是我需要不同组件中的过去和实际警告。

它只返回实际警告并忽略过去。但是当我删除 map 方法时，它可以正常工作。

P.S 我试图将这个吸气剂分成两个吸气剂

getPastOrActualWarnings: state => type => {
    const now = +new Date()
    let warnings
    if (type === 'actual') {
        warnings = state.warnings.filter(item => item.time * UNIX_TIMESTAMP > now)
    } else if (type === 'past') {
        warnings = state.warnings.filter(item => item.time * UNIX_TIMESTAMP < now)
    } else {
        warnings = []
    }

    return warnings.map(dateToString)
}

function dateToString (item) {
    item.time = new Date(item.time * UNIX_TIMESTAMP).toLocaleDateString('ru-RU', DATE_OPTIONS)
    return item
}

【问题讨论】：

看来你没问题。您是否尝试过调试类型值。试试 console.log(type);
@SameerAhmad 我像getPastWarnings () { return this.$store.getters.getPastOrActualWarnings('past') }那样调用函数
@SameerAhmad 问题出在warnings.map(dateToString)。没有地图也能正常工作

标签： javascript vue.js vuex vuex-modules

【解决方案1】：

问题是你直接用你的getter修改状态，这是你不应该做的事情。以下行修改了您之前用于对项目进行排序的item.time。 item 是对存储在状态中的对象的引用。

item.time = new Date(item.time * UNIX_TIMESTAMP).toLocaleDateString('ru-RU', DATE_OPTIONS)

要解决此问题，您可以执行以下两项操作之一：

为渲染时间使用不同的名称

item.renderedTime = new Date(item.time * UNIX_TIMESTAMP).toLocaleDateString('ru-RU', DATE_OPTIONS)

（浅）复制项目，因此您正在修改本地副本，而不是状态中的副本

function dateToString(item) {
  const localItem = { ...item };
  localItem.time = new Date(item.time * UNIX_TIMESTAMP).toLocaleDateString(
    "ru-RU"
  );
  return localItem;
}

【讨论】：