比较 Javascript 中的两个值然后映射

Question

我有来自不同架构的不同数据。我想比较来自两个模式的数据，看看它们是否相同，然后通过它们进行映射。

allStaff = [
  {
    role: "admin",
    name: "jamal",
    branch: {
      name: "kansas",
    },
  },
  {
    role: "legal",
    name: "keith",
    branch: {
      name: "arizona",
    },
  },
  {
    role: "admin",
    name: "dwyane",
    branch: {
      name: "kansas",
    },
  },
...
];

contributor = {
  fullName: 'Aaraf',
  branch: {
    name: "kansas",
  },
};

我希望此贡献者的表单选项仅包含与他（堪萨斯州）在同一分支机构的员工。

<Form.Group controlId="branch">
 <Form.Label>Investment Officer:</Form.Label>
  <Form.Control
    as="select"
    value={investmentOfficer}
      onChange={(e) => setInvestmentOfficer(e.target.value)}
 >
    <option>Investment Officer</option>
     {(allStaff.branch?.name === contributor.branch?.name).map(
       staff) => (
        <option key={staff._id} value={staff._id}>
          {staff.name}
        </option>
                          )
                        )}
                      </Form.Control>
                    </Form.Group>

Answer 1

您想在映射之前先过滤数据，以便在分支名称匹配的地方过滤 allStaff。我在下面提供了执行此操作的代码。

allStaff.filter((staff) => staff.branch.name === contributor.branch.name)
  .map((filteredStaff) => (
    <option key={staff._id} value={staff._id}>
      {staff.name}
    </option>
));

Answer 2

问题是您的代码试图映射一个布尔值....map() 是数组的内置属性，而且您的代码没有解释您要迭代的内容，所以第一步 首先找出你想要迭代的数组，然后按照这个例子，

对于此示例，我将假设您要迭代 allStaff.branch

 {allStaff.branch.map(
  (branch,i) => {
    if(branch?.name === contributor.branch[i].name)
      return (<option key={branch._id} value={branch._id}>
        {branch.firstName}
      </option>)
   })}

比较 Javascript 中的两个值然后映射

Compare Two values in Javascript then map

html

javascript

mapping

dictionary

reactjs