Currently utilizing BootstrapVue
.
I have a scenario where I need to autofill the first b-form-input
from a query string. Following that, I am required to enter an ID
in another b-form-input and validate if it matches the ID stored in my json file (associated with my Name
).
Upon successful validation, I aim for the function validDataAdded: function()
to enable a button - this is where I'm encountering a challenge and seeking guidance.
Appreciate your support!
This is my template:
<template>
<b-card class="mt-5 col-md-6">
<div class="mt-2">Name</div>
<b-form-input :disabled="true" v-model="this.Name" :value="this.Name"></b-form-input>
<div class="mt-4">ID</div>
<b-form-input type="number"></b-form-input>
<b-button :disabled="!validDataAdded">Login</b-button>
</b-card>
</template>
And here is my script:
<script>
export default {
name: "test",
data() {
return {
data: [
{
"Name": "Harry",
"ID": "1234",
},
{
"Name": "Ron",
"ID": "4321",
},
{
"Name": "Snape",
"ID": "1973",
}
]
};
},
methods: {
validDataAdded: function () {
return //NEED CODE HERE
},
},
};
</script>