WordPress Gutenberg blocks: Input fields are not editable

It turns out that in order to get to the value of an input field, you must point to it in your callback function, like so…

const onChangeBorderWidth = newBorderWidth => {
    props.setAttributes( { borderWidth: newBorderWidth.target.value })
}

This grabs the event’s input target value and assigns it to the correct attribute.

HINT: You don’t have to do this with Gutenberg’s TextControl component.. by default, it returns this event.target.value

Leave a Comment