question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Invalid prop: type check failed for prop "value" in BFormInput

See original GitHub issue

Works as expected in rc11, but not in current dev. I have a simple input, e.g.

<b-form-input :id="domId + '-amount'"
    type="number" v-model="amount" required min="0" max="100" step="any"
></b-form-input>

Amount is defined as (this is in a component):

data: function () {
    return {
        amount: 0
    };
},

This, when using dev, leads to:

[Vue warn]: Invalid prop: type check failed for prop "value". Expected String with value "0", got Number with value 0.

found in

---> <BFormInput>
       <BModal>
         <Deposit>
           <Root>

This also happens when I use v-model.number="amount". In that case, any user input will also trigger the Vue warning.

  • Arch Linux, current Chromium and Firefox, Vue 2.5.22 (and older), Bootstrap-Vue dev
  • Sorry no testcase just yet, as the playground kills my browser tab every time and for now I gave up.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Comments:8 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
tmorehousecommented, Jan 28, 2019

B form input always expects/returns a string (as per standard html5 inputs). In the dev branch use the number prop to convert to a native number object.

0reactions
jongbongacommented, Feb 2, 2021

I’m still having the issue even with the number prop

Read more comments on GitHub >

github_iconTop Results From Across the Web

Invalid prop: type check failed for prop - Stack Overflow
js but I am having trouble showing the values I am getting. I have two components and I have read the single file...
Read more >
type check failed for prop disabled. expected boolean, got ...
I get the following error in the console. Invalid prop: type check failed for prop "closable". Expected Boolean, got String with value "true"....
Read more >
Vue component should receive prop values of correct prop types
When a Vue component receives such a prop value, Vue outputs a warning ... [Vue warn]: Invalid prop: type check failed for prop...
Read more >
type check failed for prop "value". Expected Date, got String ...
I tried few suggestions in google but nothing is working. Any ideas please … Error below : [Vue warn]: Invalid prop: type check...
Read more >
Form Input | Components - BootstrapVue
<b-form-input> defaults to a text input, but you can set the type prop to one of ... For date and time style inputs,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found