Skip to content

Instantly share code, notes, and snippets.

@CITGuru
Last active December 3, 2019 00:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save CITGuru/21827d469c23afa2fb3d1aac895a0a68 to your computer and use it in GitHub Desktop.
Save CITGuru/21827d469c23afa2fb3d1aac895a0a68 to your computer and use it in GitHub Desktop.
React Component - Article (useInfiniteScroll)
import React, { useState, useEffect } from "react";
import axios from "axios";
const Article = () => {
const url = "https://medrum.herokuapp.com/articles";
const [data, setData] = useState([]);
useEffect(() => {
axios.get(url).then(res => {
setData(res.data);
});
}, []);
if (!data) {
return <div>Loading...</div>;
}
return (
<>
<ul className="list-group-ul">
{data.map((article, key) => (
<li className="list-group-li" key={key}>
<a href={article.url} target="_blank">
{article.title}
</a>
</li>
))}
</ul>
</>
);
};
export default Article;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment