React TS錯誤：使用Types時缺少屬性

Question

我正在嘗試製作一個過濾系統，但遇到了問題。 我設定了幾種類型：

type Brand = {
    brand:string;
    checked:boolean;
}
type Gender = {
    gender: "Male" | "Female" | "Kids";
    checked:boolean;
}
type Shoes = {
    brand:Brand;
    gender:Gender;
}

然後我嘗試建立一個如下所示的 useState 物件：

const [filterState,setFilterState] = useState<Shoes>({
        brand:[
            {
                brand:'New Balance',
                checked: false,
            },
            {
                brand:'Nike',
                checked: false,
            },
            {
                brand:'Addiddas',
                checked: false,
            },
            {
                brand:'Puma',
                checked: false,
            },
            {
                brand:'Converse',
                checked: false,
            },
            {
                brand:'Under Armour',
                checked: false,
            },
        ],
        gender:[{
            gender:'Male',
            checked:false,
        },
        {
            gender:'Female',
            checked:false,
        },
        {
            gender:'Kids',
            checked:false,
        }
    ],
    });

但是，在關鍵品牌和性別上，我遇到了此類錯誤：

Type '{ brand: string; checked: false; }[]' is missing the following properties from type 'Brand': brand, checked

即使我新增了所有類型屬性。任何幫助將不勝感激。

Answer 1

您需要指定您的 brand 屬性和 gender 屬性是陣列：

type Shoes = {
    brand: Brand[]; // or Array
    gender: Gender[]; // or Array
}

最好將您的屬性命名為 brands 和 ngenders 。