Getting Cannot set property of undefined Reactjs

Question

I am new to react and I need your help.

I have shared a sandbox link, In that everything works perfectly. But when we add couple new row(by clicking + at rightmost columns of the row) then if we remove some row(by clicking - at rightmost columns of the row) and then again add a new row then edit that row cell I am getting Cannot set property error. I know I have to do some changes in the handleDelete function but not getting what exactly to do. So is anyone experts here, please help me out. And regarding Icon except the last row every other row should have - icon.

Thank you. Comment if you need any clarification.

Sandbox link: https://codesandbox.io/s/suspicious-microservice-qd3ku?file=/index.js

Evgeny Klimenchenko · Accepted Answer · 2020-06-12 10:04:50Z

2

render method actually passes third argument which is actually an id of your component, in your case you don't recalculate the id and that is why your dataSource[key] tries to access key that doesn't exist in dataSource anymore.

render: (text, record, id) => (
            <Input
              {/* ... */}
              onChange={e => this.onChange(e, id)}
            />
          )

Here I updated your codesandbox https://codesandbox.io/s/angry-proskuriakova-6f2u0?file=/index.js:1095-1109

Please let me know if you have any questions.

answered Jun 12, 2020 at 10:04

Evgeny Klimenchenko

1,1941 gold badge7 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Rich Over a year ago

OK. That was what I am missing. Thanks for the help. :)

Collectives™ on Stack Overflow

Getting Cannot set property of undefined Reactjs

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related