#reactjs #typescript
Вопрос:
У меня есть функция карты, в которой я хочу реализовать функцию, в которой, если я нажму на какой-либо конкретный тег(элемент карты), он должен вызвать функцию.
<input type="text" id="search" value={input} onChange={(e) => setInput(e.target.value)}/>
<div id="suggestions">
{tags.filter(tag => {
if(input === ""){
return;
}
else if(tag.label.toLowerCase().includes(input.toLowerCase())){
return tag
}
}).map(tag => <p onClick={tag => addTag(tag.id)}>{tag.label}</p>) }
здесь, если я наведу курсор на аргумент тега внутри addTag, я получу эту ошибку
Аргумент типа «MouseEvent<HTMLParagraphElement, MouseEvent>» не может быть присвоен параметру типа «число».
Выше этого у меня есть функция
const addTag = (id: number)=> {
console.log(id)
}
Кроме того, это то состояние, в котором я
const [tags, setTags] = useState([{id: 1, label: "random"}, {id: 2, label: "important"}])
const [input, setInput] = useState("")
Как мне избавиться от этой ошибки?
Ответ №1:
Вам нужно пройти tag.id чтобы addTag
:
onClick={()=> addTag(tag.id)}
Комментарии:
1. Моя ошибка, я удалил это по ошибке, добавив вопрос. Но у меня был этот тег в качестве аргумента, {(тег) => addTag(tag.id)}, вот так. Почему это может привести меня к ошибке?
2. Потому что, если вы используете
(tag) => addTag(tag.id)
.tag
это не ваш тег, это событие параметра Onclick.