代码之家  ›  专栏  ›  技术社区  ›  Aessandro

到JS阵列的MOBX可观测地图

  •  1
  • Aessandro  · 技术社区  · 6 年前

    我有一个组件作为属性传递“form.$('userprofile').fields”的值,这是一个可观察的映射,如console.log屏幕截图所示:

    类位置扩展react.component<*>。{
    呈现()。{
    console.log(this.props.fields);
    this.props.fields.map(函数(i,el){
    控制台日志(i,el)
    })
    返回(<h1>位置字段</h1>);
    }
    }
    

    是否可以这样做:

    this.props.fields.map(函数(i,el){
    控制台日志(i,el)
    //呈现React组件
    })
    

    在何处可以基于从map方法内部获得的值呈现子组件?

    class Location extends React.Component<*> {
        render() {
            console.log(this.props.fields);
            this.props.fields.map(function(i, el){
                console.log(i, el)
            })
            return (<h1>location fields</h1>);
        }
    }
    

    enter image description here

    是否可以这样做:

    this.props.fields.map(function(i, el){
        console.log(i, el)
        // render React components
    })
    

    在何处可以基于从map方法内部获得的值呈现子组件?

    1 回复  |  直到 6 年前
        1
  •  1
  •   Tholle    6 年前

    你可以使用 values or entries 在可观察的 Map 要获取所有值或条目的迭代器,并将其分散到新数组中并映射到该数组上,请执行以下操作:

    class Location extends React.Component<*> {
      render() {
        return (
          <div>
            <h1>location fields</h1>
            {[...this.props.fields.entries()].map(function(entry) {
              return (
                <div key={entry[0]}>
                  {entry[0]}: {entry[1]}
                </div>
              );
            })}
          </div>
        );
      }
    }