Implement shouldComponentUpdate in some base components to limit rerenders #289
Conversation
…ate to limit rerenders
…ntUpdate to limit rerenders
pmuchowski
changed the title
|
@pmuchowski Actually i pulled those changes locally and I noticed that for ValueSelectorField column name (in ArrayField) is not displayed (the one that is set in componentConfig.label). Fix would be appreciated (i guess it should be placed right in specified field configuration - like type or attributes, instead inside componentConfig). |
|
@awalkowiak I added the missing label |
| @@ -81,9 +81,25 @@ const PRODUCTS_MOCKS = [ | |||
| { value: '4', label: 'Similac Advance low iron 400g' }, | |||
| ]; | |||
|
|
|||
| const STOCK_LIST_ITEMS_MOCKS = { | |||
| 1: [{ productCode: 1, maxQuantity: 10 }, | |||
There was a problem hiding this comment.
The naming of this field doesn't really matter, I just wanted to point out that this is more like "default quantity" rather than "max quantity". In other words, the quantity value for the item will be set by this value, but it can be increased or decreased by the user.
| } | ||
|
|
||
| shouldComponentUpdate(nextProps, nextState) { | ||
| if (this.state.touched !== nextState.touched) { |
There was a problem hiding this comment.
Can you explain what this.state.touched is used for? Is this a way of detecting events that put focus on the component (like tabbing into a field or mouse click on the field)? Can you also explain this logic here? Is this saying as long as the next state isn't the same as the current state, we should update the component? In what scenario would the current state == next state?
There was a problem hiding this comment.
The touched property indicates if the element was visited (had focus), it's used in validation, the validation errors are displayed only when field is touched, so you don't have errors on every required field when displaying the form. By default React will update the component every time it will receive props even if those props was not changed. I'm using the shouldComponentUpdate method to limit rerenders and only do it when it's needed, because they are time consuming
No description provided.