Javascript react UI中数组值的过滤和呈现 我是新来的 我试图从下拉框、复选框和文本框中获取用户输入值 然后使用对象数组(JSON)值进行验证,并在UI中呈现过滤后的数组值 我使用了array.filter()方法和条件呈现来执行 此外,我还对过滤和渲染过滤值印象深刻 要在UI中呈现的值是球员姓名和运动成绩 你们能用你们的建议帮我解决这个问题吗 stackblitz链接中提供了完整的代码: 提供以下代码段:

Javascript react UI中数组值的过滤和呈现 我是新来的 我试图从下拉框、复选框和文本框中获取用户输入值 然后使用对象数组(JSON)值进行验证,并在UI中呈现过滤后的数组值 我使用了array.filter()方法和条件呈现来执行 此外,我还对过滤和渲染过滤值印象深刻 要在UI中呈现的值是球员姓名和运动成绩 你们能用你们的建议帮我解决这个问题吗 stackblitz链接中提供了完整的代码: 提供以下代码段:,javascript,html,reactjs,Javascript,Html,Reactjs,index.js Players Belonging to same zip code: <input type="text" name="zip_code" defaultValue={zip1} onChange={this.handleChange_zip}></input> <br /> Number of male over certain age: <input type="number" name="age_numb

index.js

Players Belonging to same zip code:
     <input type="text" name="zip_code" defaultValue={zip1} onChange={this.handleChange_zip}></input> <br />

      Number of male over certain age: <input type="number" name="age_number" defaultValue= {age1} onChange={this.handleChange_age}></input> <br />

      Students not Belonging from a given state: 
      <select value={state1} onChange={this.handleChange_state}>
        <option value="select">Select</option>
        <option value="CA">CA</option>
        <option value="TX">TX</option>
      </select><br/>

      List of Subjects received grades: <input type="checkbox" name="subjects" value={check} onChange={this.handleChange_sub}></input><br/>

      <button onClick={this.sportsZipSearch.bind(this)}>Submit</button><br />
      {zipValue && <Zip result={result} />}


sportsZipSearch = () => {
    const { zip1, age1, count } = this.state;

    const newArray = students.filter((el) => { return ((el.zip === zip1) && (el.Age <= age1) && (el.sports_state === state1) && check) });
    this.setState({ result: newArray, zipValue: true })
  }
属于同一邮政编码的玩家:

超过一定年龄的男性人数:
不属于某一州的学生: 挑选 加利福尼亚州 德克萨斯州
收到成绩的科目列表:
提交
{zipValue&&} sportsZipSearch=()=>{ const{zip1,age1,count}=this.state; const newArray=students.filter((el)=>{return((el.zip==zip1)和&(el.Age){ 返回( props.result.map( 结果=> {results.player_first_name} /*这不是一个完美的键,但考虑到手头的值*/ ) ) }
比较字符串时要小心,如(el.Age非常感谢您的回复…代码正在运行…但有一个澄清供将来使用…如果我们声明check为false值,在选中该框时,我们是否能够将其设置为true…我正在尝试呈现体育比赛及其在比赛中的分数…您是否能够为下面的体育比赛迭代提供建议过滤数组迭代1.我们能否将其设置为true>>是。在handleChange_子函数show list Sports:{result.length&&result[0].Sports_games.map(g=>{var visibility=(check|g[Object.keys(g)[0]])中更改“this.setState({check:!this.state.check})”运动列表:{result.length&&result[0]{[Object.keys(g)[0]}}@nmDat…感谢您的回复…我理解并计算得很好…现在我正在尝试渲染体育游戏,并为游戏提供分数…您能否在过滤数组下为体育游戏迭代提供建议iteration@nmDat...Thanks非常感谢您的回复和建议…我会制定代码并让您知道
const Zip = (props) => {
  return(
    props.result.map(
      results => 
      <h1 key={results.player_first_name}>{results.player_first_name}</h1>
      /* This is not a perfect key, but given the values at hand */
      )
  )
}
parseInt(el.Age) <= parseInt(age1))
("15" <= "100")
 -> return false