无法更新useEffect()中的useState()常量

问题描述 投票:0回答:1

`const [详细信息,setDetails] = useState({ “id”:0, “创建”:“”, “标题”: ””, "general_category": "", “特定类别”:“”, “mentee_max”:“”, “导师”: ””, “描述”: ””, “时间线”: ””, “检查点”:“”, "prereuisites": "", "co_mentor_info": "", “横幅图像”:空, “代码”: ””, “第1季 }); 让 {ProjectId} = useParams(); 项目 ID = parseInt(项目 ID); const [愿望清单,设置愿望清单] = useState([]); const [isLoading, setIsLoading] = useState(true);

useEffect(() => {
    axios.get(`/api/projects/${ProjectId}/`)
    .then((response) => {
        // Assuming the response contains the image URL
        console.log(response.data);
        response.data.description = response.data.description.split("\\r\\n").join("<br>");
        response.data.description = response.data.description.replace(
            /(https?:\/\/[^\s]+)/g,
            '<a href="$1" class="text-blue-600 hover:underline" target="_blank" rel="noopener noreferrer">$1</a>'
        );
        setDetails(response.data);
    })
    .catch((error) => {
        console.error('Error fetching card image:', error);
    });
}, []);


const [Added, setAdded] = useState();
useEffect(() => {
    axios.get('/api/projects/wishlist/')
      .then((response) => {
        console.log(response.data);
        setWishlist(response.data);
        setIsLoading(false);
        
      })
      .catch((error) => {
        console.error('Error fetching card image:', error);
        setIsLoading(false);
      });
  }, []);

  useEffect(()=>{
    const isAdded = wishlist.some((item) => item.id === details.id);
        setAdded(isAdded);
        console.log(isAdded);
  }, [Added]);

  const wishDetails = {
      project_id: details.id,
      title: details.title,
      banner_image: details.banner_image,
      general_category: details.general_category,
    };
    let buttonMessage = Added ? "Remove From Wishlist" : "Add To Wishlist";

  const formData = new FormData();

  Object.keys(wishDetails).forEach(key => {
      formData.append(key, wishDetails[key]);
  });

  const WishlistAdd = (e) => {
    if (!Added) {
      console.log(formData)
    
      axios
        .post("/api/projects/wishlist/", formData)
        .then((res) => {
          console.log(res);
          setAdded(true);
        })
        .catch((err) => console.log(err));
    } 
    else {
        axios.delete(`/api/projects/wishlist?project_id=${details.id}`)
        .then((res) => {
          console.log(res);
          setAdded(false);
        })
        .catch((err) => console.log(err));
    }
  };`
javascript reactjs react-hooks axios frontend
1个回答
0
投票

我认为这可以解决这个问题,因为你没有定义usestate状态的数据类型

const [Added, setAdded] = useState();
© www.soinside.com 2019 - 2024. All rights reserved.