我有一个自定义组件，用户可以在其中使用下拉/输入组合搜索值并单击结果或在下拉列表中滚动和搜索并单击该值，这会将输入值设置为单击的下拉值。
假设值为：['foo', 'bar', 'fee']
如果我在下拉列表中单击“foo”，输入值将按预期更改为“foo”。但是，如果我退格到“f”，然后再次单击“foo”，它会将变量设置为“foo”，但不会更新下拉值。
如果我的值是“foo”，我退格并单击“fee”，它会像它应该的那样更新。
我的值没有在输入中更新是什么问题？
搜索选择.html：
<div>
<input type="text"
(input)="filterDropdown()"
[(ngModel)]="filterValue" [value]="selectedItemName"/> <-- no change here
{{selectedItemName}} <-- does change here (but I don't want it here)
<div>
<div *ngFor="let item of filteredItems" (click)="setItem(item)">
{{item.name}}
</div>
</div>
搜索选择.ts：
public setItem(item): void {
this.selectedItemName = item[this.itemName];
}
我有一个表单组件，您可以在其中单击按钮添加输入，创建一个新团队，并在其中添加球员。
问题是，如果您输入一个值，则所有输入都将被该值填充，因为它使用的是相同状态。我的猜测是为每个新团队创建一个新的状态值（类似于“输入” +索引，这将导致输入0，输入1，输入2等状态）。
尽管我无法使用React Hooks实现此操作，因为您必须首先声明状态并为其分配一个set函数。
是否对如何实现这种行为有任何想法？
简单案例；我正在呈现“评论”列表。这些是使用以下 Proptype 提供的：
export interface Props {
title: string;
name: string;
reviewdesc: string;
rating: number;
}
通过父组件中的结果进行映射：
{reviews.map((review: Props) => {
return <Review data={review} />;
})}
并在子组件中使用相同的 Proptypes：
const Review = (data: Props) => { ...
它给了我这个错误：
Type '{ data: Props; }' is not assignable to type 'IntrinsicAttributes & Props'.
Property 'data' does not exist on type 'IntrinsicAttributes & Props'.
感觉好像忘记了一件小事。我想我应该像{data}在子组件中一样捕捉道具，但它给出了：
Property 'data' does not exist on type 'Props'.
我使用 React Hooks 一段时间了，但对我来说最大的问题是使用数组。
我正在为团队制作一份注册表。球队有球员（字符串数组）。
用户应该能够添加团队，并且对于每个团队，都会显示一个输入，并在输入上方显示团队中的当前成员。
我的问题：如何使用 React Hooks 设置嵌套数组的状态？
单击按钮时，它应该（目前）将一个字符串添加到当前团队的玩家数组中。
我的代码：
interface ITeam {
id: string;
players: Array<string>;
}
export default function Team() {
const [teams, setTeams] = useState<Array<ITeam>>([{id: '1', players: ['a', 'b']}]);
return (
<div>
{teams.map((team, teamIndex) => {
return (
<div key={teamIndex}>
<h2>Team {teamIndex + 1}</h2>
<ul>
{team.players.map((player, playerIndex) => {
return (
<div key={playerIndex}>
{player}
</div>
);
})}
</ul>
<button onClick={() => setTeams([...teams, team.players.concat('c')])}>Add player</button>
</div>
);
})}
</div>
);
}