I'm encountering an issue with the code I have in this codesandbox link. The code features a form with validation and a disabled "Calculate" button that should only become enabled when all fields are valid. However, I'm receiving the error message
Cannot read property '__isVuelidateAsyncVm' of undefined Initially, let me provide some feedback. It's commendable that you have shared a sandbox, but it is essential that your question includes the necessary code to reproduce the problem. Without it, the question loses its value once the link becomes inactive.
After conducting some debugging to pinpoint the problematic field, I discovered that the error stems from the gender field. Upon closer inspection of the inArray custom validator, I noticed that it lacks a return statement, leading to the validation failure. Make sure to include return inside your inArray function:
const inArray = (value, vm) => {
// don't forget to add return!
return vm.items.some(gender => value.indexOf(gender) !== -1);
};
Furthermore, I recommend utilizing debugging techniques to isolate the issue, which could potentially enable you to resolve it independently :)
Below is the remaining relevant code pertaining to your problem:
<v-select
v-model="user.gender.value"
:items="user.gender.items"
label="Gender"
:solo="true"
:error-messages="userGenderErrors"
append-icon
></v-select>
Snippet from the script:
validations: {
user: {
gender: {
value: {
required,
inArray
}
},
}
},
Facing a similar issue, I would like to extend my gratitude to Bogdan for posing the question and AT82 for providing the solution that proved to be quite helpful :)
Allow me to share my experience as well. Initially, I had the following code snippet:
validations() {
return {
VaccineUpload: {
vaccines: {
$each: {
isValidInput: (vaccine) => {
const { brand, date } = vaccine
return (!brand && !date) || (brand && date)
}
}
}
},
The issue arose from the return statement
return (!brand && !date) || (brand && date)null instead of a boolean, resulting in the error. To rectify this, I modified the code to:
return !!((!brand && !date) || (brand && date))Always ensure that you are returning a boolean to ensure seamless implementation of the validations.
I'm struggling with a particular issue in my code. <select ng-model="selected_student" class="form-control"> <option ng-repeat="obj in students" value="{{obj.id}}">{{obj.name}}</option> </select> When I try to set the sel ...
I am working on a scene that includes 3 cubes and a DAT.GUI menu. My goal is to switch any cube to wireframe mode when it is selected in the menu individually. Although my code is successful for 2 out of the 3 cubes, I am facing an issue where the first c ...
Do you think there is a more efficient way to write this code? It seems quite impractical and takes up a lot of space. Essentially, it's about the random chance of obtaining a rarity, like acquiring an Uncommon sword. if (Math.random() * 100 < 100 ...
Currently, I'm developing Vue.JS code to showcase data fetched by PHP from a server. The PHP sends a JSON object to the Vue for display. Below is my existing code snippet: axiosPost(); } function axiosPost() { axios.post( './Conver ...
My dropdown menu is not working despite adding all necessary Bootstrap CDN and files along with the jQuery script. Even with the table being handled by JavaScript, the button does not respond when clicked repeatedly. I suspect the issue lies within the han ...
Here is my Directive code: module.directive('iconSwitcher', function() { return { restrict : 'A', link : function(scope, elem, attrs) { var currentState = true; elem.on('click', function() { ...
Is it feasible for me to display the location of each logged-in user's <div> on a custom position on my page for other users to see? I would like to achieve this in (near) real-time if possible. Any guidance or suggestions on how to accomplish ...
Looking to modernize my app with a new build system and I could use some guidance. It seems like I need to shift my approach in a few ways. Here's the current structure of my app: /src /components /Base /App.jsx /Pages.jsx /. ...
Consider the following example of a JavaScript object: const myObject = { id: 'my_id', // Base value which sets the structure for the following values (always pascal case). upperID: 'MY_ID', // Uppercase version of `id`. camel ...
After extensive research, I am starting to think that using multiple versions of the same JavaScript library on a single page is not possible (without utilizing jquery Can I use multiple versions of jQuery on the same page?, which I am not). However, I wan ...
Looking to emphasize the second list item (li) within a selected dropdown list with a designated unordered list class of "chosen-results". <div class="chosen-container chosen-container-single select-or-other-select form-select required chosen-proc ...
Is it possible to trigger a mouseover event on the y-axis label in a chart? For instance, let's say we have a scatter plot with labels "area1", "area2", and "area3" on the y-axis. When a user hovers over the label "area1", a tooltip should appear disp ...
Having recently transitioned from on-premise databases using Oracle 11g to the Cloud where I needed to connect to Oracle 12c, I encountered an issue with my nodejs application. While it worked fine on-premises, in the cloud it threw the following error: e ...
How do I retrieve the id of the first div with the class: post, which is "367", using jquery in the given HTML code: <div id="own-posts"> <span class="title">Me</span> <div class="posts_container"> <div class="post"& ...
I'm currently working on an app with a single screen displaying a map centered on the user's current coordinates. In my code below, I've set the latitude and longitude to null in the state of the App component. Using the componentDidMount() ...
My website utilizes a vue.js Single Page Application, interacting with a .NET 6 API through ajax calls. I am looking to implement Google account login for users and authenticate them to the API by passing their Google ID or email. What would be the most ef ...
I am working with a three.js canvas that contains circles moving independently. Initially, these circles are connected by a single line that follows the same geometry as their positions. However, I am facing difficulty updating the line's geometry wh ...
In need of assistance with resolving an issue related to default parameters and object destructuring. The 'product' object that I am working with has the following structure: { name: "Slip Dress", priceInCents: 8800, availableSizes ...
My auto search module has the following JSON structure. I need to iterate through an array of JSON objects and use keys and values as required. I have attempted the code below. However, with the provided JSON object, I am able to retrieve the key but not ...
As a newcomer to JavaScript React, I've been attempting to create a feature where the navbar drops a shadow when the user scrolls down. Unfortunately, it's not working as intended. Can anyone point out what I might have done incorrectly? I suspe ...