Get newly added object in Material-ui Autocomplete component

Question

I'm using material-ui Autcomplete component with multiple selection. And for one of the scenario, I need to get the value for newly added item. When I'm using onChange listener, it is giving me all the values selected in Autocomplete input. Is there any way to get only added or removed one?

Codesandbox - https://codesandbox.io/s/xqex8?file=/demo.js

Answer 1

according to the doc, the onChange funct receive three properties, called event , value , and reason. You can receive the value of newly added item by taking advantage of event.target.textContent as below:

onChange={(event, value) =>
          console.log(
            top100Films.filter(
              (el, id) => el.title === event.target.textContent
            )
          )
        }

sandbox