Question

听到我调用显示页面视图功能组件加载

render() {
    const { currentPageData } = this.props;
    return (
        <div>
            {this.displayPageView()}
        </div>
    )
}

听取displaPageView函数

displayPageView(){
    const obj = {
        centralead : {add: "1", edit: "1", index: "1", delete: "1"},
        contacts : {add: "1", edit: "1", index: "1", view: "1", archive: "1"},
        links : {add: "1", edit: "1", index: "1", view: "1", delete: "1"}
    };
    forEach(accessKey,(value,key) => {
        console.log("key >>",key);
        forEach(value,(value2,key2) => {
            console.log("value2 >>",value2);
            console.log("key2 >>",key2);
            return (<div><h1>{key}</h1><h1>{key2}</h1><h1>{value2}</h1></div>);
        });
    });
}

我在console.log中获得了关键和值，但是bot返回了该组件的视图。我使用了来自'lodash'的foreach。

Answer 1

Lodash的forEach不会返回任何内容，请改为使用map：

const map = _.map;

class Demo extends React.Component {
  render() {
      return (
          <div>
              {this.displayPageView()}
          </div>
      )
  }

  displayPageView(){
      const obj = {
          centralead : {add: "1", edit: "1", index: "1", delete: "1"},
          contacts : {add: "1", edit: "1", index: "1", view: "1", archive: "1"},
          links : {add: "1", edit: "1", index: "1", view: "1", delete: "1"}
      };
      
      return map(obj, (value,key) => map(value,(value2,key2) => (
        <div><h1>{key}</h1><h1>{key2}</h1><h1>{value2}</h1></div>
      )));
  }
}


ReactDOM.render(
  <Demo />, 
  demo
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="demo"></div>

React js对象for循环不返回元标记

1 个答案: