search

yuche / vue-strap

Bootstrap components built with Vue.js
http://yuche.github.io/vue-strap/
MIT License
4.71k stars 931 forks source link

:value.sync cannot accept integer variable #358

Open maulshh opened 8 years ago

jankincl commented 8 years ago

I seem to have the same issue with bs-input, when I have the variable which is synced with Integer value, I get this error.

vue-strap.min.js:3 Uncaught TypeError: (this.value || "").trim is not a function

The bs-input seems to work only with Strings. Is this a bug or is there something I am missing?

jankincl commented 8 years ago

I found a solution - in the Input.vue source file, I added type String and coerce string for the Value prop.

value: {
                twoWay: true,
                type: String,
                coerce: coerce.string,
                default: '',
            },

Is it ok like that? Can this be added in the next release maybe?

wffranco commented 8 years ago

The DOM input element always return a string. If you need another input type then convert the value yourself. And according to the vue2 specifications, coerce was removed, so try to not depend of conversion on the component side.

jankincl commented 8 years ago

Thanks for the answer. I am loading the numbers from a database to an object which is binded with the input components. That's why it seemed more logical to "convert" the number to string inside of the component using coerce, not in the object where I need them for calculations. Does that make sense?

But if you believe it shouldn't be done in the component, maybe make the value type: String, so it throws a warning right away, and not an error with a trim function in validation.

wffranco commented 8 years ago

I understand you, but like I said in vue2 coerce was removed, and I will try to migrate the components to that. Independently of the type of data you send to the component, I recommend you to make the conversion by your side, in my opinion the component should not do that, the input always handle a string.

Maybe according to the data type I could do some conversion, but I'm not sure if I will do it.

tonypee commented 7 years ago

Im running into the same issue. An error message would be nice at very least. It seems like a common issue in a world of json, couldnt you just use soemthing like

this.val !== undefined && String(this.val)

tonypee commented 7 years ago

This is an issue - because the data in the database stores certain values as numbers, i need to keep doing manual conversions. It would be great it vue-strap could just use == not === to compare values. It is very common to want to set numbers into things like a selector.