Meteor: sortablejs method not being called - node.js

Question

I've got a component that when simplified looks like so:
import Sortable from 'react-sortablejs';
class App extends Component {
constructor(props) {
super(props);
}
updateItemOrder() {
let items = this.props.items;
items.forEach((item, index) => {
console.log(item._id);
console.log(index);
updateItem.call({ _id: item._id, update: { priority: index } });
});
};
render() {
<Sortable
tag='ul'
className='item-list list-group'
onChange={ this.updateItemOrder() }>
{ this.renderItems() }
</Sortable>
}
}
My console lists the item._id and the index on page load, but nothing happens when I drag-and-drop items in my sortable list. Changing to a <ReactSortable> component doesn't help, either (as per the docs).

Answer 1

From your above code specifically this part here,
updateItemOrder() {
let items = this.props.items;
items.forEach((item, index) => {
console.log(item._id);
console.log(index);
updateItem.call({ _id: item._id, update: { priority: index } });
});
};
It would seem that you are trying to mutate props which is a no go in react. To cause a re-render in react, you need to update state and tell react this change is state should cause a re-render. This is done using setState. There 2 options that come to mind right of the bat. First you can capture your props in the local state of this component and update that, or you can call a method back in your parent component to update its state forcing it to re-render.