Clever Geek Handbook

In React, how should the state of a reusable List component be managed?

I created a simple List component to be reusable in my application and can contain different types of elements. The state of this list corresponds to an array of elements.

What I was interested in is that this state should be kept inside the List component or outside through the parent. For example:.

Case 1:

MyComponent = React.createClass(

  getInitialState: ->
    items: [1,2,3,4,5]

  render: ->
    List items: @state.items
)

Case 2:

MyComponent = React.createClass(

  render: ->
    items= [1,2,3,4,5]
    List initialState: items
)
+3


source to share


1 answer


The state should be kept at the highest point where it is needed. So if it's just UI state and MyComponent doesn't care about the elements, then the List should own it. Otherwise, MyComponent should.



State is passed and returned only with callbacks.

+2


source






More articles:


All Articles