Input errors stop the component completely

[SteveEdson]

I'm using a slider and an input field that are both bound to the same data property. My slider has min and max values, so when the user uses the input field instead, for example deleting the default value, to type another, the slider errors with a message

"The value of the slider is , the minimum value is X, the value of this slider can not be less than the minimum value"

This is fine, but the issue is that this error stops all functionality from there on. Is there a way that this can just throw a warning, or a way to re-initialise the slider so that the user can correct their input and carry on as normal?

Thanks

[NightCatSama]

You can bind a component's value without using v-model.

https://jsfiddle.net/2xy72dod/8579/

[SteveEdson]

Thanks