如何将两个数字从firebase中加起来

Question

是新手的反应，感觉很难用React进行数学计算，一直试图从Firebase数据库中添加两个值，但是它一直将值显示为字符串，而不是添加两个值，请我需要帮助。

{contactObjects [id] .gcc} + {contactObjects [id] .lcc} 添加这两个只会显示全部作为字符串

，例如 如果{contactObjects [id] .gcc}在firebase datebase中= 10，{contactObjects [id] .lcc} as = 30，

然后将 +添加到代码中，则不会总结两个值，它将仅将它们显示为 10 + 30是字符串，而不是40，

请如何处理。

import React, { useState, useEffect } from "react";
import ContactForm from "./ContactForm";
import firebaseDb from "../firebase";

const Contacts = () => {
  var [contactObjects, setContactObjects] = useState({});
  var [currentId, setCurrentId] = useState("");

  useEffect(() => {
    firebaseDb.child("contacts").on("value", (snapshot) => {
      if (snapshot.val() != null)
        setContactObjects({
          ...snapshot.val(),
        });
      else setContactObjects({});
    });
  }, []); // similar to componentDidMount

  const addOrEdit = (obj) => {
    if (currentId == "")
      firebaseDb.child("contacts").push(obj, (err) => {
        if (err) console.log(err);
        else setCurrentId("");
      });
    else
      firebaseDb.child(`contacts/${currentId}`).set(obj, (err) => {
        if (err) console.log(err);
        else setCurrentId("");
      });
  };

  const onDelete = (key) => {
    if (window.confirm("Are you sure to delete this record?")) {
      debugger;
      firebaseDb.child(`contacts/${key}`).remove((err) => {
        if (err) console.log(err);
        else setCurrentId("");
      });
    }
  };

  return (
    <>
      <div className="jumbotron jumbotron-fluid">
        <div className="container">
          <h1 className="display-4 text-center">Contact Register</h1>
        </div>
      </div>
      <div className="row">
        <div className="col-md-5">
          <ContactForm {...{ addOrEdit, currentId, contactObjects }} />
        </div>
        <div className="col-md-7">
          <table className="table table-borderless table-stripped">
            <thead className="thead-light">
              <tr>
                <th>Full Name</th>
                <th>Mobile</th>
                <th>Email</th>
                <th>Address</th>
                <th>Street</th>
                <th>Address</th>
                <th>Gcc</th>
                <th>Lcc</th>
              </tr>
            </thead>
            <tbody>
              {Object.keys(contactObjects).map((id) => {
                return (
                  <tr key={id}>
                    <td>{contactObjects[id].fullName}</td>
                    <td>{contactObjects[id].mobile}</td>
                    <td>{contactObjects[id].email}</td>
                    <td>{contactObjects[id].address}</td>
                    <td>{contactObjects[id].street}</td>
                    <td>{contactObjects[id].gcc}</td>
                    <td>{contactObjects[id].lcc}</td>
                    <td>
                      {contactObjects[id].gcc} +
                      {contactObjects[id].lcc}
                    </td>
                    <td>
                      <a
                        className="btn text-primary"
                        onClick={() => {
                          setCurrentId(id);
                        }}
                      >
                        <i className="fas fa-pencil-alt"></i>
                      </a>
                      <a
                        className="btn text-danger"
                        onClick={() => {
                          onDelete(id);
                        }}
                      >
                        <i className="far fa-trash-alt"></i>
                      </a>
                    </td>
                  </tr>
                );
              })}
            </tbody>
          </table>
        </div>
      </div>
    </>
  );
};

export default Contacts;

Answer 1

如果我正确理解，那么只需将这些值解析为int即可。如果在db中这些是“字符串”

{parseint（contactObjects [id] .gcc） + parseint（contactObjects [id] .lcc）}