File tree Expand file tree Collapse file tree 1 file changed +35
-0
lines changed Expand file tree Collapse file tree 1 file changed +35
-0
lines changed Original file line number Diff line number Diff line change @@ -505,6 +505,41 @@ function isJson(str) {
505505}
506506` ` `
507507
508+ # Fetch data from API REACT
509+ ` ` ` REACT JS
510+ import React , {Component } from ' react'
511+
512+ export default class StarWars extends Component {
513+ constructor (){
514+ super ()
515+ this .state = {
516+ character: {},
517+ isLoading: false
518+ }
519+ }
520+
521+ componentDidMount (){
522+ this .setState ({isLoading: true })
523+ fetch (" https://swapi.co/api/people/1" )
524+ .then (response => response .json ())
525+ .then (data => (
526+ this .setState ({
527+ isLoading: false ,
528+ character: data
529+ })
530+ ))
531+ }
508532
533+
534+ render (){
535+ const text = this .state .isLoading ? " People data is loading..." : this .state .character .name
536+ return (
537+ < div>
538+ < p> {text}< / p>
539+ < / div>
540+ )
541+ }
542+ }
543+ ` ` `
509544
510545
You can’t perform that action at this time.
0 commit comments