bootstrap-vue: becoming out of sync with value if using formatter

When a form-input has a formatter on it stripping out characters in the case of trying to only allowing numerial values in a text input, the input value can sometimes not match up with the emitted value.

codepen: https://codepen.io/Kalvens/pen/Lqabrj (type any nonnumerical character in the input) browser: Chrome Version 69.0.3497.100 (Official Build) (64-bit) OS: linux

I believe the issue comes from https://github.com/bootstrap-vue/bootstrap-vue/blob/a14245cc27751e395f34b90fba20db16869a3484/src/mixins/form-text.js#L107-L123

the value is already formatted at that point so if the formatter strips out all of the characters leaving the value to be an empty string, nothing will happen even though the input still has a value set for it

I was playing around with your source code and doing

if (this.localValue !== value) {
    ...
} else if (this.$el.value !== value)  {
  this.$el.value = value;
}

seems to fix my issue, but I am not sure if that would be affecting anything else using the mixin.

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 2
  • Comments: 17 (7 by maintainers)

Commits related to this issue

Most upvoted comments

This has not been released yet, it will when @tmorehouse is done preparing the next release candidate. https://github.com/bootstrap-vue/bootstrap-vue/pull/3168