Проблемы при
1клике -> добавляется класс но не значение.
2клике -> удаляется класс но добавляется высота текста, а не значения 80 как я хотел
3клике -> добавляется класс но добавляется значение 80, а не высота текста как я хотел
самый важный минус это не рендерится компонент.
Где я допустил ошибку?
const Post = ({ post }) => {
const [heightDesc, setHeightDesc] = useState();
const descRef = useRef();
function unwrapDesc() {
descRef.current.classList.toggle("active");
if (descRef.current.classList.contains("active")) {
setHeightDesc(descRef.current.scrollHeight);
descRef.current.style.height = heightDesc + "px";
} else {
setHeightDesc(80);
descRef.current.style.height = heightDesc + "px";
}
}
return (
<div className="post">
<h2 className="post__title">{post.title}</h2>
<img className="post__img" src={post.img} alt={post.title} />
<p ref={descRef} className="post__desc">
{post.desc}
</p>
<button className="post__btn" onClick={unwrapDesc}>
Развернуть
</button>
</div>
);
};
