react 깊이 순환 내장 대상 렌 더 링 문제 map

일부 자 료 를 찾 아 보 니 react 의 순환 렌 더 링 대상 은 map 뿐 이지 만 map 는 배열 대상 만 지원 합 니 다.
배경 데 이 터 를 받 으 면 다음 과 같 습 니 다.

{
  "list": {
    "A": [{
      "image": "http:///b1.jpg",
      "name": "  ",
      "id": "1"
    }],
	"B": [{
      "image": "http:///b1.jpg",
      "name": "  ",
      "id": "1"
    }] 	
  }
}

A, B 를 순환 해서 받 아야 돼 요. A. B 안의 데이터
비동기 로 데 이 터 를 받 은 후 다음 과 같이 처리 합 니 다.

getbrandInfoFun = async type => {
        try {
            let result = await API.getbrandInfo({
                id: 'wechat'
            });
            let carListArr = [];
            for (let item in result.list) {//async、await    map foreach     for  
                let reobj = {};
                reobj[item] = result.list[item];
                carListArr.push(reobj);
            }
            this.setState({
                brandInfoList: carListArr,/*      */
            });
        } catch (err) {
            
          
        }

}

render 처 리 는 다음 과 같 습 니 다:


{
	this.state.brandInfoList.map((value, index) => {
		let carListArr=[];
		let carListkey=[];
		for (let item in value) {
			carListkey=item
			carListArr=value[item];
		}
		return (
			
				{carListkey}
				{
					carListArr.map((item, numberN) => (
						
							
								 
							
							
								{item.name}}
							
						
					))
				}
			
		)
	})
}

구현 효과:

좋 지 않 은 것 같 지만 이런 방법 만 생각 났 어 요. 앞으로 더 좋 은 방법 이 있 었 으 면 좋 겠 어 요.

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

nginx 에서 사이트 아이콘 표시 설정

전단 개발 환경: react：^16.4.1 webpack：^4.16.0 웹 팩 에 favicon. ico 설정 추가: nginx 는 ico 에 대한 지원 을 추가 합 니 다:...

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

react 깊이 순환 내장 대상 렌 더 링 문제 map

좋은 웹페이지 즐겨찾기