Implementing table support in js project

I'm working on a hack to maintain a table (sibling) with draft.js

I have one requirement: All existing editor functions should also work inside this table

I present you with three options: pick one and explain why you did it :

  • Nested editors (one for each cell). Im Imging Id should implement handling of choosing between editors.
  • Table cells as enitites, wrapped in a Custom Block component that renders the table and manipulates columns and rows. - It will be expensive as I will need to intervene with event handling and rendering.
  • Is there any other way that you think might work better?
+3


source to share


1 answer


I am using nested editors in every cell ( option 1 ). Implementing style functions within each cell is much easier. You can use the functionality you already used in the main editor.

There are two main components in my table implementation. Component Table

, a custom block component. And inside each cell of this component is Subeditor

(nested editor component). The EditorState for each Subeditor

is stored in the Redux store.



Handling the choice between editors is pretty helpful.

0


source







All Articles