Ответы пользователя по тегу React
  • Допускается ли такой подход что бы сделать textarea-autosize?

    @Alexprintme
    Как то так:
    import React, { useEffect, useRef, useState} from "react";
    const defaultStyle = {
        display: "block",
        overflow: "hidden",
        resize: "none",
        width: "100%",
        backgroundColor: "mediumSpringGreen"
    };
    
    const AutoHeightTextarea = ({ style = defaultStyle, ...etc }) => {
        const textareaRef = useRef(null);
        const [currentValue, setCurrentValue ] = useState("");
    
        useEffect(() => {
            textareaRef.current.style.height = "0px";
            const scrollHeight = textareaRef.current.scrollHeight;
            textareaRef.current.style.height = scrollHeight + "px";
        }, [currentValue]);
    
        return (
            <textarea
                ref={textareaRef}
                style={style}
                {...etc}
                value={currentValue}
    
                onChange={e=>setCurrentValue(e.target.value)}
            />
        );
    };
    
    export default AutoHeightTextarea;
    Ответ написан
    Комментировать