How to render a Object in React?

后端 未结 4 861
忘了有多久
忘了有多久 2021-02-14 09:16

I want to render a Object .

My Object is:

const ObjectTest = {
        1: {
            id : 1,
            name:\'ABC\'
                 


        
4条回答
  •  遇见更好的自我
    2021-02-14 09:25

    Data is an object so directly we can't use map on that, so use Object.keys or Object.entries to get the array first, then use map on that to create ui items.

    Using Object.keys:

    _renderObject(){
        return Object.keys(ObjectTest).map(obj, i) => {
            return (
                
    id is: {ObjectTest[obj].id} ; name is: {ObjectTest[obj].name}
    ) }) }

    Using Object.entries:

    const ObjectTest = {
        1: {
            id : 1,
            name:'ABC'
        },
        3: {
            id: 3,
            name:'DEF'
        }
    }
    
    class App extends React.Component{
    
    	_renderObject(){
    		return Object.entries(ObjectTest).map(([key, value], i) => {
    			return (
    				
    id is: {value.id} ; name is: {value.name}
    ) }) } render(){ return(
    {this._renderObject()}
    ) } } ReactDOM.render(, document.getElementById('app'))
    
    
    
    

    Check this answer also: How to loop an object in ReactJS?

提交回复
热议问题