score:0
the response you are getting from your server shows that you are not getting an array but instead 1 artist. you need to make your server return an array of books info. so your json response would be:
[
{
"id":"1",
"author": "j.k rowling",
"title": "harry potter",
"pages":"7000"
},
{
"id":"2",
"author": "a.k sayomh",
"title": "singer role",
"pages":"10000"
},
//...
]
then in your ag-grid you can then use the .map
function like you were doing.
if you don't get an array of books info then that api is not meant for your use case.
let's say the api return an object if the total amount of data is 1 and an array if more. then what you could do it.
useeffect(() => {
fetch(http://fakeapi.com/)
.then(res => res.json())
.then(json => array.isarray(json)
? json.map(res => ({
author: res.author,
title: res.title,
id: res.id,
pages: res.pages,
))
: [json]
).then(res => setrowdata(res));
}, []);
Source: stackoverflow.com
Related Query
- Trying to return objects similar to mapping
- How can I make useEffect not return the initial value? I keep getting empty array when I'm trying to pass an array of objects into a component
- trying to merge two objects and return merged object in react
- Objects are not valid as a React child (found: [object Promise]) trying to return swal
- Problems trying to return api data without a class
- mapping an array of objects and changing the value with on onClick in React
- Dynamically mapping an array of objects to table row
- Generate options by mapping over array of objects with react-select
- show dynamic select items mapping over array of objects
- Lost input focus when trying to update an array of objects in React Hooks
- TypeScript/React - Mapping over av array of objects
- Return fields by comparing to array of objects using Map Filter
- ReactJS: rendering multiple objects in return
- mapping and filtering an array of objects with key
- How to re-render react component when mapping over state that is array of objects
- An error comes when mapping array of objects in React
- How I can loop through the similar objects in state and push them into object?
- Array of objects and i want to return true if any key value pair in the object is duplicate
- Objects are not valid as a React child when trying to map
- Sort a json with nested objects structure and return a format same as the structure of json
- Mapping through multiple nested objects in JSON
- Return one or two objects with getDerivedStateFromProps?
- Compare current to previous when mapping array of objects onto html elements
- Confusion with mapping arrays of objects JS / Next / React
- Mapping over Menu objects causing multiple menus to open due to state
- Mapping array objects and updating state variable. data is lost
- consistently return objects instead of promises useEffect()
- A Meteor publication or subscription returns an array of objects when it should return just one object
- React Reducer function to return array of objects
- Using a value to compare against an array of objects to return a different value within that object?
More Query from same tag
- react datetimepicker with meteor
- antd table search filtering
- How to make default number of items selected in React bootstrap table pagination
- Trying to call the token API after token expires using ReactJs
- In VSCode how to properly configure jsconfig.json in order for absolute paths with index.js imports to work?
- Component renders nothing
- Reload Live Image without Flickering in React
- setState into store component
- validate css properties without selector using CSSLint module Javascript
- <Provider /> outside or <Router /> outside>?
- Getting a blank page in react app while deploying using ngnix as reverse proxy
- React Native: App Store Rejection, Support for IPv6
- React Router V6 - Redirect inside Route Component
- when i use mobx with react-router here is a warning
- React Reducer is not updating State
- How to get the React router path on route change
- dependency array in react use effect
- setState of an array to the values of another array
- In terms of Redux, is the view render what triggers the store to set up the initial sate? Or is the store initially set up first anyway?
- text not showing in an input-label element
- react router slug compared to part of array
- How to change the text colour of a materialize input field within local home.scss file
- Dynamically loading react pages
- How to make the react web app full screen
- How to render html code in strings of a Gatsby config file?
- Using HTMLFormElement.reset() with Downshift and react-hook-form
- Mapping axios response (array of arrays) to typescript interface
- react-router " Cannot read property 'push' of undefined"
- How to use async/await promises with React props/state?
- How to define a type once and assign it to a function and a component in React TypeScript?