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

React动态添加x个用于筛选数据的选择框

  •  1
  • Adam  · 技术社区  · 7 年前

    我有一个应用程序,在不同的屏幕上有不同的选择框过滤器。

    这是指向沙盒的链接 https://codesandbox.io/s/ym5qyjj5jv

    我遇到的问题是

    1) 我想从page.js连接状态,这样就可以为每个过滤器设置值,然后当用户单击reset时更新该状态。主要问题是在searchbar.js中将状态作为prop获取

    我在json中有一个状态名,我用它来生成过滤器,所以我想写这个.props.[variable],但这不起作用

    1 回复  |  直到 7 年前
        1
  •  0
  •   Adam    7 年前

    我成功了,看问题中的链接。

    在page.js中,我传递了state(…this.state)

     <SearchBar
              onChange={this.onChange}
              onReset={this.onReset}
              filters={filters}
              {...this.state}
            />
    

    然后在searchBar.js中,当我在过滤器json中循环时,我可以得到prop

    value={this.props[filter[1].name]}
    

    如果其他人有更好的方法,那就告诉我