Questions tagged [vue-props]
Seeking help with utilizing the "props" property in Vue.js? Be sure to include the [vue.js] tag when posting your question.
When working with a component that retrieves API data and passes it down to child components, I encountered an issue. I attempted to split the information into separate ref objects for each child component but ran into a problem - reactivity was lost. The ...
I've been stuck on this issue for quite some time now. I've created a table with 3 columns, and for the first two columns, I can easily display the contents of each row using the prop property. However, for the third column, I need to display information f ...
I am struggling with passing an object as a prop from a parent component and then utilizing it to initialize the child component with the received value. The main objective behind this is to create a dialog box that includes a child form component with mu ...
In my Vue project's homepage, a series of Bootstrap cards need to contain hyperlink buttons that lead to URLs with a common base URL. The ending of each URL should be determined by the "name" property value of the prop associated with the card. For in ...
Attempting to display an AJAX response in a popover shown by clicking an icon (a custom Vue component) brings about a challenge. The issue arises when there are multiple instances of this component, dynamically rendered through the v-for directive within a ...
I need help with sending the 'products' prop to my persistent layout in order for it to display the products in the search field and filter them correctly. How can I achieve this? Thank you! app.js ... import MainLayout from &quo ...
One thing I'm curious about is the use of react consumer and provider for passing variables in React. Does Vue offer a similar feature? I have a Firebase class that needs to be passed to almost every component, and passing it through props doesn&apos ...
This is the parent component called abc.vue <v-card outlined class="mt-4"> <DetailsTable v-show="toggleClientData" :columnDefs="columnDefs" :rowData="rowData" /> </v-card> methods:{ aggridData() { let self = this; th ...
In my development project, I am working with three key components: component-1, component-2, and an App component. Initially, I pass a Boolean prop from component-1 to component-2. Through the use of a @click event, I am able to toggle this prop value betw ...
Trying to incorporate a select element into a Vue custom component using the v-model pattern outlined in the documentation. The issue at hand is encountering an error message for the custom select component: [Vue warn]: Avoid directly mutating a prop as i ...
I have been working with a basic input component that includes the property type, which has been functioning well so far. However, I am facing some challenges when trying to implement password obfuscation. How can I toggle the visibility of the password w ...
I'm working with a custom component that utilizes the v-date-picker in various instances. My goal is to have the ability to dynamically set the initial date from the parent component, while also allowing the date to be modified from the child componen ...
Currently, I am monitoring two props on a child component (basicSalaryMin and basicSalaryMax). Once the value changes, my next step is to update a reactive value on the parent component (data.companyModels, which is also passed to the child component as a ...
Parent component: ShowComment Child component: EditComment I'm attempting to pass the value stored in this.CommentRecID to the child component. In the template of ShowComment, I have included: <EditComment CommentRecID="this.CommentRecID" v-if="show ...
I have a question about the ValidateCheckboxes component I am working with. ValidateCheckboxes is a specialized list of checkboxes that I pass to the component as props. Here's how it typically looks: view image here view image here I use v-for to dis ...
I am encountering an issue while attempting to create a custom child component with props as row data. The error message "rows.slice is not a function" keeps appearing, and upon inspecting the parent data, I found that it is an Object. However, the props r ...
Within my application, I am working with a parent and child component. The parent component directly includes the child component, which needs to access data from the parent. This data is fetched from a REST API within the parent component. However, when t ...
Having recently made the switch from Vue2 to Vue3, I find myself a bit perplexed about the best approach for sharing props among multiple components. My goal is to create input components that can share common props such as "type", "name", and so on. Previ ...
I am currently working on a project using Vue. Following the guidelines of eslint, I am restricted from naming props in camel case. If I try to do so, it triggers a warning saying Attribute ':clientId' must be hyphenated. eslint vue/attribute-hyphenation a ...
Is there a way to suppress the default Vue warning [Vue-warn] when displaying a custom validator message on a prop? I am currently seeing both the custom error message and the Vue warning. This is what my prop looks like: props: { mode: String, defaul ...
It is commonly understood that when the child component is mounted before the parent component, trying to access props in the child component's mounted period will result in null. However, I recently came across a scenario where props were successful ...