时间戳

首页 > 解决方案 > 如何在带有复选框的反应js中编写过滤器

javascript - 如何在带有复选框的反应js中编写过滤器

问题描述

我有一个稍后将被替换为 api 的 cont，但现在它看起来像这样，类似于后来的 api：

const foo = {
 {'id':1,
 'price':200,
 'type':1,},
  {'id':2,
 'price':200,
 'type':2,},
};

我正在使用一个简单的重要 ui 复选框：

render() {
const { classes } = this.props;

return (
  <FormGroup row>
    <FormControlLabel
      control={
        <Checkbox
          checked={this.state.checkedA}
          onChange={this.handleChange('checkedA')}
          value="checkedA"
        />
      }
      label="type A"
    />

现在，我想要一个简单的过滤系统，用于检查此复选框时，只需带上第一个类型为1或价格为200的项目

标签： javascriptreactjs

解决方案

我的理解是，您需要根据选中的复选框过滤数据。如果您的数据是一个数组，您可以像这样过滤它：

const foo = [
 { 'id': 1, 'price': 200, 'type': 1 },
 { 'id': 2, 'price': 200, 'type': 2 }
];

const filteredData = foo.filter(item => item.type === selectedType);

selectedType您选中的复选框的值在哪里。

我希望这有帮助。

推荐阅读