Skip to content

Updating contentEditable div fails if it is empty #48

@centsi

Description

@centsi

Hi, I'm finding mobx-jsx so much easier to use than React - thank you.

I do have a problem with using a contentEditable div however - when the div becomes empty by the user deleting its contents it ceases to update from changes elsewhere and generates an error (I excluded the rest of the stack trace as I suspect it isn't needed):

[mobx] uncaught error in 'Reaction[Autorun]' TypeError: Cannot set properties of null (setting 'data') at insertExpression (mobx-jsx.js:775:42)

This is a trimmed down version of the code that causes it:

export function Editable(){
    Data.amount = 25;
    return <div
        contentEditable
        onInput={e=>Data.amount=e.target.innerText}>{Data.amount}</div>
}

Is there a way to prevent that happening? As for my purposes using a contentEditable div is so much nicer than using an input - mostly due to how difficult it is to make an input exactly fit its contents.

Thanks - Lawrence

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions