Deepseek ArtifactsDeepseek Artifacts

修复代码:无axios

4.0
en
编程
代码修复
React
useEffect
API调用

Prompt

please correct for me this code, no axios

	useEffect(() => {
		const fetchData = async () => {

			try {
				const response = await axios.get('https://www.technosysa.com/new_announce.php', {
					params: {
						id: idParam,
						mode: 'get_announce'
					},
					headers: {
						'Content-Type': 'application/json',
					}

				});
				console.log(response.data);
				setItem(
					{
						id: idParam,
						description: response.data.description,
						Name_person: response.data.Name_person,
						telefono: response.data.telefono,
						whatsapp: response.data.whatsapp,
						email: response.data.email,
						file_path_user_jpg: file_path_user_jpg
					}
				);
			} catch (error) {
				console.error('Error fetching data:', error.data);
			}

		};
		fetchData();
	});

Generated Result

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

const App = () => {
  const [item, setItem] = useState({});
  const idParam = 'someId'; // Replace with actual id

  useEffect(() => {
    const fetchData = async () => {
      try {
        const response = await fetch(`https://www.technosysa.com/new_announce.php?id=${idParam}&mode=get_announce`, {
          headers: {
            'Content-Type': 'application/json',
          },
        });
        const data = await response.json();
        console.log(data);
        setItem({
          id: idParam,
          description: data.description,
          Name_person: data.Name_person,
          telefono: data.telefono,
          whatsapp: data.whatsapp,
          email: data.email,
          file_path_user_jpg: data.file_path_user_jpg,
        });
      } catch (error) {
        console.error('Error fetching data:', error);
      }
    };
    fetchData();
  }, [idParam]);

  return (
    <div className="App">
      <h1 className="text-3xl font-bold text-center text-blue-500">Announcement Details</h1>
      <div className="mt-4 p-4 bg-gray-100 rounded-lg shadow-md">
        <p className="text-gray-700">{item.description}</p>
        <p className="text-gray-700">{item.Name_person}</p>
        <p className="text-gray-700">{item.telefono}</p>
        <p className="text-gray-700">{item.whatsapp}</p>
        <p className="text-gray-700">{item.email}</p>
        <img src={item.file_path_user_jpg} alt="User" className="mt-4 w-32 h-32 rounded-full" />
      </div>
    </div>
  );
};

export default App;

More Recommendations

View All