I'm trying to make a filtering system and I'm running into a problem. I set up several types:
type Brand = {
brand:string;
checked:boolean;
}
type Gender = {
gender: "Male" | "Female" | "Kids";
checked:boolean;
}
type Shoes = {
brand:Brand;
gender:Gender;
}
Then I try to create a useState object like this:
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,
}
],
});
However, on key brands and genders, I'm getting errors like this:
Type '{ brand: string; checked: false; }[]' is missing the following properties from type 'Brand': brand, checked
Even if I add all type attributes. Any help would be greatly appreciated.
You need to specify that your
brandattribute andgenderattribute are arrays:type Shoes = { brand: Brand[]; // or Array
gender: Gender[]; // or Array
} It's best to name your properties
brandsandngenders.