我的响应数据未存储到React JS中的变量中

发布于 2025-02-07 05:10:06 字数 963 浏览 3 评论 0原文

我正在尝试将响应数据存储到activationType变量中，在使用效率的内部，我正在基于TABS值来循环API，API将返回值true或<代码> false ，我能够在控制台上获取值，但是当我尝试存储数据时，我会得到空数组。

  const tabs = [
    // {value: 'All', label: `${i18n.t('AllActivity')}`},
    {value: 'ActSendGift', label: `${i18n.t('Gifts')}`},
    {value: 'ActSubscribe', label: `${i18n.t('Subscribers')}`},
    {value: 'ActFollow', label: `${i18n.t('Followers')}`},
  ];

  const activityType: any = [];

  useEffect(() => {
    async function fetchData() {
      return tabs.map(async (item: any) => {
        return await Api.user
          .getSettingValues(item.value)
          .then((response: any) => {
            // console.log(response.settingValue); // true
            // console.log(item.value); "ActSendGift"
            return activityType.push(response.settingValue);
          });
      });
    }
    fetchData();
  }, [activityFeedData.activityList, activityType]);

原文

I am trying to store my response data into the activityType variable, inside the useEffect I am looping an API based on tabs value, the API will return is the value true or false, and I am able to get the values on my console but when I try to store the data I am getting empty array.

  const tabs = [
    // {value: 'All', label: `${i18n.t('AllActivity')}`},
    {value: 'ActSendGift', label: `${i18n.t('Gifts')}`},
    {value: 'ActSubscribe', label: `${i18n.t('Subscribers')}`},
    {value: 'ActFollow', label: `${i18n.t('Followers')}`},
  ];

  const activityType: any = [];

  useEffect(() => {
    async function fetchData() {
      return tabs.map(async (item: any) => {
        return await Api.user
          .getSettingValues(item.value)
          .then((response: any) => {
            // console.log(response.settingValue); // true
            // console.log(item.value); "ActSendGift"
            return activityType.push(response.settingValue);
          });
      });
    }
    fetchData();
  }, [activityFeedData.activityList, activityType]);

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

木森分化 2025-02-14 05:10:06

您可以使用“ Usestate”钩子，而不是在React中声明变量。

首先，您需要导入钩子

import {useState, useEffect} from 'react'

和功能组件内部，可以在获取数据后更新状态。

const [activityType, setActivityType] = useState<any>([])

useEffect(() => {
    async function fetchData() {
      return tabs.map(async (item: any) => {
        return await Api.user
          .getSettingValues(item.value)
          .then((response: any) => {
          // console.log(response.settingValue); // true
          // console.log(item.value); "ActSendGift"
          return setActivityType(response.settingValue);
        });
    });
    fetchData();
}, [activityFeedData.activityList, activityType]);

USESTATE挂钩返回两个值，一个是状态变量，第二个是状态更新函数。该组件将随着状态的变化自动重新渲染。

you can use 'useState' hook instead of declaring a variable in react.

first you need to import the hook

import {useState, useEffect} from 'react'

and inside your functional component you can update the state after fetching the data.

const [activityType, setActivityType] = useState<any>([])

useEffect(() => {
    async function fetchData() {
      return tabs.map(async (item: any) => {
        return await Api.user
          .getSettingValues(item.value)
          .then((response: any) => {
          // console.log(response.settingValue); // true
          // console.log(item.value); "ActSendGift"
          return setActivityType(response.settingValue);
        });
    });
    fetchData();
}, [activityFeedData.activityList, activityType]);

The useState hook returns two values, One is the state variable and the second one is the state update function. The component will re-render automatically as the state changes.

回复收藏 0 原文

段念尘 2025-02-14 05:10:06

尝试将此数组放入状态，并确保正在更新Usefct依赖项数组中的变量，以便执行此块。

const tabs = [
    {value: 'ActSendGift', label: `${i18n.t('Gifts')}`},
    {value: 'ActSubscribe', label: `${i18n.t('Subscribers')}`},
    {value: 'ActFollow', label: `${i18n.t('Followers')}`},
  ];

  const [activeType, setActiveType] = useState([])

  useEffect(() => {
    async function fetchData() {
      return tabs.map(async (item: any) => {
        return await Api.user
          .getSettingValues(item.value)
          .then((response: any) => setActiveType(response.settingValue));
      });
    }
    fetchData();
  }, [activityFeedData.activityList]);

Try putting this array into a state and ensure that the variables that are in the usefct dependency array are being updated so that this block is executed.

const tabs = [
    {value: 'ActSendGift', label: `${i18n.t('Gifts')}`},
    {value: 'ActSubscribe', label: `${i18n.t('Subscribers')}`},
    {value: 'ActFollow', label: `${i18n.t('Followers')}`},
  ];

  const [activeType, setActiveType] = useState([])

  useEffect(() => {
    async function fetchData() {
      return tabs.map(async (item: any) => {
        return await Api.user
          .getSettingValues(item.value)
          .then((response: any) => setActiveType(response.settingValue));
      });
    }
    fetchData();
  }, [activityFeedData.activityList]);

回复收藏 0 原文

~没有更多了~