How to render data from api like this-CodePudding

How do I render data from this api I want to render Advice from this api

    fetch("https://api.adviceslip.com/advice")

CodePudding user response：

In plain JS, see the code below or try this link

fetch("https://api.adviceslip.com/advice")
  .then(response => response.json())
  .then(data => {
    console.log('Success:', data);
  })
  .catch((error) => {
    console.error('Error:', error);
  });

CodePudding user response：

You can try:

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

export default function App() {
  const [advices, setAdvices] = useState([]);
  console.log(advices); // you should have the fetch data here

  async function fetchData() {
    try {
      const response = await fetch('https://api.adviceslip.com/advice');
      const data = await response.json();
      setAdvices(data.slip);
    } catch (error) {
      console.error(error);
    }
  }

  useEffect(() => {
    fetchData();
  }, []);

  return <></>;
}