Javascript 如何使用reduce计算反应组分的总量？

我想计算总金额，包含在我的数据库中

我的类组件：

import React, { Component } from "react";
import { connect } from "react-redux";
import formatCurrency from "./utils";
import { fetchCountries } from "../actions/countries.actions";
import Modal from "react-modal";
import { Zoom } from "react-awesome-reveal";

class Countries extends Component {
  constructor(props) {
    super(props);
    this.state = {
      country: null,
    };
  }
  componentDidMount() {
    this.props.fetchCountries();
  }

  openModal = (country) => {
    this.setState({ country });
  };

  closeModal = () => {
    this.setState({ country: null });
  };

  render() {
    const { country } = this.state;
    return (
      <div>
        {!this.props.countries ? (
          <div>Loading...</div>
        ) : (
          <ul className="countries">
            {this.props.countries.map((country) => (
              <li key={country._id}>
                <a
                  href={"#" + country._id}
                  onClick={() => this.openModal(country)}
                >
                  <br />
                  {country.title}
                </a>
                <br />
                {country.year}
                <br />
                **{country.phase}**
                <br />
                **{formatCurrency(country.amount)}**
              </li>
            ))}
          </ul>
        )}

        {country && (
          <Modal isOpen={true} onRequestClose={this.closeModal}>
            <Zoom>
              <button className="close-modal" onClick={this.closeModal}>
                X
              </button>
              <div>Modal</div>
              <div className="country-details">
                <div className="country-details-description">
                  <p>
                    <strong>{country.title}</strong>
                  </p>
                  <p>{country.description}</p>
                </div>
              </div>
            </Zoom>
          </Modal>
        )}
      </div>
    );
  }
}

export default connect(
  (state) => ({ countries: state.countries.filteredItems }),
  {
    fetchCountries,
  }
)(Countries);

import React，{Component}来自“React”；
从“react redux”导入{connect}；
从“/utils”导入格式货币；
从“./actions/countries.actions”导入{fetchCountries}”；
从“反应模态”导入模态；
从“显示”导入{Zoom}；
类国家扩展组件{
建造师（道具）{
超级（道具）；
此.state={
国家：空，
};
}
componentDidMount（）{
this.props.fetchCountries（）；
}
OpenModel=（国家）=>{
这个国家（{country}）；
};
closeModal=（）=>{
this.setState（{country:null}）；
};
render（）{
const{country}=this.state；
返回(
{！这是道具国家(
加载。。。
) : (

{this.props.countries.map（（国家）=>(



{国家年}


**{国家阶段}**


**{格式货币（国家/地区金额）}**

))}

)}
{国家&&(
X
情态动词

{country.title}

{country.description}

)}
);
}
}
导出默认连接(
（state）=>（{countries:state.countries.filteredItems}），
{
这些国家，
}
)（国家）；

因此，我正在寻找如何呈现一个数学运算，例如总量即

{country.amount}

的实际即

{country.phase===“actual}

---

在这种情况下，我不知道如何使用

。reduce

。

以下是如何使用reduce来计算

阶段为
实际
的项目的
金额的总和：


const countries=[{amount:10，阶段：'actual'}，{amount:10，阶段：'B'}，{amount:15，阶段：'A'}，{amount:30，阶段：'actual'}，]
console.log(
国家减少(
（会计科目，当前）=>当前阶段==“实际”？会计科目+当前金额：会计科目，0
))
太好了！非常感谢！