Аргумент типа «MouseEvent» не может быть присвоен параметру типа «число»

#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.