Блог

 import useState from "react-usestateref";  const [meta, setMeta, metaRef] = useState({});  

Внутри JSX компонента:

 data.result.map((token) =gt; {  const id = token.token_id;  const params = { uri: token.token_uri };   if (token.metadata) {  setMeta(JSON.parse(token.metadata));  } else {  Moralis.Cloud.run("get_token_uri", params).then(  (response) =gt; setMeta(response)  );  }  const { name, description, imageUrl } = metaRef.current;  return (  lt;Card  key={id}  tokenId={id}  name={name}  description={description}  user_address={user_address}  imageUrl={fixURL(imageUrl)}  calledFrom={calledFrom}  /gt;  );  })  

Я хочу обновить переменную мета-состояния внутри data.result.map и использовать обновленный мета-объект для возврата компонента карты. Я использую react-usestateref, чтобы получить текущее значение переменной мета-состояния. В противном случае мета по-прежнему остается {} при деструктурировании, даже после обновления. Если знак.метаданные не являются нулевыми, я хочу установить значение var мета-состояния в маркер.объект метаданных, и если он равен нулю, я хочу сделать асинхронный запрос, чтобы вернуть объект из Moralis, а затем установить его в мета-состояние var. Этот код выдает следующую ошибку: Неперехваченная ошибка: Слишком много повторных отрисовок. React ограничивает количество рендеров, чтобы предотвратить бесконечный цикл.

Как я могу заставить этот код работать так, как задумано?