时间戳

首页 > 解决方案 > 如何获取承诺的“数据”属性值

reactjs - 如何获取承诺的“数据”属性值

问题描述

我正在使用 Express + MongoDB 构建一个 React 应用程序。

我试图弄清楚如何将获取的数据分配给组件的状态。

我有这条路线：

router.get('/totalbalance', (request, response) => {
    TotalBalanceModelTemplate.find(request.totalBalance, (error, data) => {
        if (error) {
            return error
        } else if (data.length === 0) {
            return response.send("No records found")
        } else {
            response.json(data[0])
        }
    })
});

这是 axios 请求（位于另一个文件中）和状态的 setter/getter：

const [insertedValue, setInsertedValue] = useState<string>("");

useEffect(() => {
   const resp = axios.get('http://localhost:4000/app/totalbalance')
       .then(result => result.data);

   setInsertedValue(resp);
}, []);

cont "resp" 等于一个带有参数 "data" 的 promise，它等于data: {_id: "60c48b4ec60919553d92319f", totalBalance: 5555, __v: 0}.

如何提取值resp.totalBalance并将其分配给变量？

目前setInsertedValue(resp)给出一个错误Argument of type 'Promise<any>' is not assignable to parameter of type 'SetStateAction<string>'。

谢谢！

标签： reactjsmongodbhttpaxiosget

解决方案

这是您的 .json - 可视化：

它有 3 个属性 - 并且只有 1 个嵌套级别。

在此处输入图像描述

访问该数据：

    const [data, setData] = useState();
    
        useEffect(() => {
           const resp = axios.get('http://localhost:4000/app/totalbalance')
               .then((result) => {
                 if(result.data.length > 1) {
                   setData(result.data)
                 }
                else{
                   console.log('empty response)'
                }
                )};
           setInsertedValue(resp);
        }, []);

在此代码中，将整个对象保存到数据状态。

要访问特定财产，需要：

  1. data._id = 第一个值
  2. data.totalBalance = 第二个值
  3. data.__v = 第三个值

有可能只保存 totalBalance：

const [totalBalance, setTotalBalance] = useState();

useEffect(() => {
   const resp = axios.get('http://localhost:4000/app/totalbalance')
       .then(result => setTotalBalance(result.data[0].totalBalance));

   setInsertedValue(resp);
}, []);

其中 0 - 是对象的数量 - 在这种情况下，它是数组中的第一个对象。它可以循环存储来自 x 个对象的所有 totalBalances。

推荐阅读