React-sortable-hoc: Using controlled components inside SortableElement

[artboard-studio]

Hi

I need to have a text input inside the SortableElement and it has to be controlled so that I can change its value, and a value of another item changes based on that, but apparently since this plugin uses HOC I can not have states inside SortableElement.

Is there any way around this? (using defaultValue on the text input does not work in my case)

[clauderic]

Sure, you can absolutely use state.

Here's a basic example:

class MyElement extends Component {
  state = {
    value: 'Test'
  }
  render() {
    return <input value={this.state.value} onChange={(e) => this.setState({value: e.target.value})} />;
  }
}

const SortableMyElement = SortableElement(MyElement);