Add text to console from quill texteditor in React

Question

I have an task where I want to save the text from the texteditor in the console.

I use ReactQuill as a text editor and I know how to add it with the Onchange function.

But what if I instead what to have a button that have a onClick function that adds the text from the text editor to the console. How do I do that? my code looks like this right now, but cant get it to work.

export default function Editor() {
    const [text, setText] = useState("");

    const handleText = e => {
        console.log(e);
        setText(e);
    }
    return (
        <>
            <button type="button" onClick={handleText}>
                Click Me
            </button>
            <ReactQuill
                placeholder="Write something"
                value={text}

            />

        </>
    )
}

How do I connect the button with the ReactQuill text?

score 0 · Accepted Answer · answered Sep 08 '22 at 13:02

If you just want to log the text to the console

export default function Editor() {
    const [text, setText] = useState("");

    const handleText = e => {
        console.log(text);
    }
    return (
        <>
            <button type="button" onClick={handleText}>
                Click Me
            </button>
            <ReactQuill
                placeholder="Write something"
                value={text}
                onChange={setText}
            />

        </>
    )
}

Add text to console from quill texteditor in React

1 Answers1