reactjs 动态设置状态在react中无效

nbysray5  于 2023-02-03  发布在  React
关注(0)|答案(1)|浏览(105)

我试图动态设置一个数组,并使用useState钩子呈现它。但似乎数组没有设置。下面是我的代码:

import React, { useState, useEffect } from "react";

export default ({ item }) => {
    const [attachments, setAttachments] = useState([]);
    const setAttachmentValues = function(response){
        setAttachments(response.data);
        
    }
    const fetchMedia = async ()=> {
        setAttachments([]);           
        await apiCall().then((response) => {                
            setAttachmentValues(response);                
        });
    }
    
    useEffect(() => {
        fetchMedia();
    }, []);
    return (
        <>
           <div className="w-full">
                {(attachments.map((ele) => {
                      <div>{ele}</div>
                )} 
        </>
    )
}

apiCall()将返回一个对象数组。
这种方式的setState在某些情况下工作得很好。这里的实际问题是什么?

xt0899hw

xt0899hw1#

这样您就可以渲染数据

import React, { useState, useEffect } from 'react';

export default ({ item }) => {
  const [attachments, setAttachments] = useState([]);

  useEffect(() => {
    
    fetch('https://jsonplaceholder.typicode.com/users')
      .then((response) => response.json())
      .then((response) => {
        setAttachments(response);
        console.log(response);
      });
  }, []);
  return (
    <>
       <div>
        {attachments.map(item => <div key={item.username}> {item.username} </div> )}
      </div>
    </>
  );
};

相关问题