I need to access the createdAt variable to convert it via date() to a real date. But somehow, i can’t access it by auth.currentUser.createdAt variable. How can i do this in Vue3? It is also that i want to use shallowRef for it, because it should never change. How can i do this? >Solution :… Read More How can i get the registered-date from Firebase Auth in Vue3?
I have a component called TableContainer with the following dynamically named slots // … <td class="…"> <slot :name="’statuses-‘ + item.id" /> </td> <td class=""> <slot :name="’actions-‘ + item.id" /> </td> //… I want to call them from the parent component as follows: <TableContainer :data="people"> <template v-for="person in people" v-slot:statuses-{person.id}> {{ person.status }} </template> </TableContainer> This… Read More Call Vue Slot by Dynamic name
i’m trying to get the total result length but i’m not getting anything in my template this my script data() { return { searchResults: [], totalResults: [], }} const response = await axios.post( "http://localhost:5000/api/search", searchData ); this.searchResults = response.data.Response.Results; // Set the search results in the component’s data // Retrieve the traceId from the response… Read More how do i get the total array length in vuejs
I have the following code in a .vue file: <template> <button @click="entries.push(3)"> Press me! </button> <ul> <li v-for="entry in entries" :key="entry"> {{ entry }} </li> </ul> </template> <script setup> const entries = [1, 2] </script> After pressing the button I would expect a third li element to show up, yet nothing happens. What am I… Read More Javascript + Vue: array failing to be reactive
I have a problem with preloading in vue. Problem is that i need to know when the last image has loaded and rendered in the DOM, in order to perform some other stuff. Never mind the data, the images renders etc. What i need to know is how to check for when the last one… Read More How to preload images in vue using @load?
im tried to build logo carousel in vue. The issue im facing is that animation is not working that enable images to go from left to right. in addition im planning to add another one but right to left animation i have tried to convert html/css code and integrate them to work in vue but… Read More facing issue in animation while building logo carousel in vue
In my child vue component I have this referenced object that I emit to the parent: const skuForm = ref({ sku: ”, oneTime: false, noDiscount: false, korean: false }); const addSku = () => { emit(‘add’, skuForm.value); } I want to send to the parent component the plain json object. This is what I do… Read More Pass ref to parent without proxy
I have been working on an SPA with Vue 3, TypeScript and The Movie Database (TMDB) API. I have a movie card component (MovieCard.vue) that I use in (at least) 2 diffrent contexts and I want it to behave slightly difrentlly from one context to another. <template> <div class="movie card" @click="showDetails(movie.id)"> <div class="thumbnail"> <img :src="movieCardImage"… Read More How can I make parts of a reusable component's template optional in a Vue 3 app?
I am working on an application where I need to load data on component load. Where I am binding ag-grid-vue. I am facing an issue my Api response is late and grid gives an show below. caught (in promise) TypeError: rowData.map is not a function Here is my code on component load <script> import {… Read More How to load API data into vue 3 grid
I am trying to copy a component from one of my old vue projects that only uses JS into a TS/Vue Project and came across a few hurdles. <script lang="ts"> import { computed, ref } from "vue"; import { defineComponent } from ‘vue’ export default defineComponent ({ setup() { const todo = ref(""); const todos… Read More Vue3 + TS: How to fix type 'never' for ref of empty array?