汇总 React 属性中对象数组中的所有'score'值

Question

对不起标题的舌头扭曲者，但这是一个非常具体的问题。

目前，我有一系列对象通过道具过去。我正在尝试将所有"分数"值总结在一起并将其显示在我的应用中。

对象看起来像这样：

[{'id': '1', 'score': '10'}, {'id': '2', 'score': '20'}, {'id': '3', 'score': '35'}]

在应用程序内部被称为：

state = { 
     content: this.props.navigation.getParam('content', false),
}

---

scoreCount = () => {
    const content = this.state.content;
    if (content) {
        return content.reduce((prev, current) => prev.score + current.score);
    } else {
        return false;
}

---

render() {
const score = this.scoreCount()
return (
                <View>
                    <Text>Score:</Text>
                    { score ?
                        <Text>
                            { score }
                        </Text> :
                        <Text>
                            0
                        </Text>
                    }
                </View>
)}

它在返回时显示" Undefined35"

我知道这与未在通话时无法使用的道具有关，但我不确定如何将其正确返回到视图

任何帮助都将不胜感激

Answer 1

看来您正在尝试添加字符串，因为score的值是'10'，而在哪个是字符串。因此，您可以使用单一操作员将其转换为数字。其次，我认为prev.score在第一个添加期间将是一个问题，因为没有score密钥。因此，在减少0中，将被视为第一个元素

let content = [{
  'id': '1',
  'score': '10'
}, {
  'id': '2',
  'score': '20'
}, {
  'id': '3',
  'score': '35'
}];
let sum = content.reduce(function(prev, current) {
  return prev + +current.score
}, 0);
console.log(sum)