然后在 React 中过滤数组并映射答案

【问题标题】：Filter an array and map in then in React然后在 React 中过滤数组并映射
【发布时间】：2021-05-16 03:06:06
【问题描述】：

我正在研究以下过滤器/映射功能：

  <div className ="filteredSitter" >
          <h4> Available sitters </h4>
          <h5> Click on their name to get in touch with them</h5>
           {sitters.filter(InitialSitter => InitialSitter.locationSitter === "London").map(filteredSitter => (
        <li onClick = {function (){alert(`${filteredSitter.nameSitter} is located in ${filteredSitter.locationSitter} and his phone number is ${filteredSitter.phoneSitter}`);}}>
          {filteredSitter.nameSitter}
        </li>
      ))}
            
        </div>

我的问题是 - 我不想使用“伦敦”作为强制比较，而是想使用以所有者形式插入她的数据的最新人（我尝试使用 props.owners.locationOwner但它不起作用。）知道如何与作为国家一部分的人的位置进行比较吗？

这是我拥有的状态和初始所有者（因此我想与进入此数组的其他用户的位置进行比较）。

let InitialOwners = [
  { nameOwner: 'Jim', locationOwner: "Barcelona", phoneOwner: "+34 671 872 000" , startDateOwner: "01/03/2021" , endDateOwner : "08/03/2021" },
  { nameOwner: 'Jessica', locationOwner: "Paris", phoneOwner: "+34 651 871 000" , startDateOwner: "20/03/2021" , endDateOwner : "28/03/2021" }
];

function App() {

 
  const [owners, setOwners] = useState(InitialOwners);
  
  .....

谢谢你！！

【问题讨论】：

嘿，你能分享完整的组件吗？
当然！干得好！！从“反应”导入反应；函数 PlantSittingOffers({sitters}){ return (
{sitters.filter(InitialSitter => InitialSitter.locationSitter === "London").map(filteredSitter => (
${filteredSitter.nameSitter} is located in ${filteredSitter.locationSitter} and his phone number is ${filteredSitter.phoneSitter});}}> {filteredSitter.nameSitter}

) }