108,388 questions
0
votes
0
answers
19
views
Typescript tsconfig ignored
I am getting a typescript error that shouldn't happen because the tsconfig should prevent it from being compiled. In my tsconfig file I have skipLibCheck set to true. I have the node_modules folder ...
0
votes
1
answer
25
views
Does a Nuxt layout requires special arrangements for single file components?
I created a Nuxt project from scratch to learn about layouts.
I changed app.vue to
<template>
<NuxtLayout>
<NuxtPage />
</NuxtLayout>
</template>
In layouts I ...
- 30k
0
votes
0
answers
17
views
Difference between nuxtApp.provide and vueApp.provide
In nuxt 3 you have two alternative ways to provide something globally
// using nuxtApp instance
useNuxtApp().provide('key', 'value')
console.log(nuxtApp.$key) // value
// using vueApp instance
...
- 1,829
0
votes
0
answers
28
views
Laravel Vue Echo -Uncaught ReferenceError: Echo is not defined
I am using vue js with laravel blade.
my vue mount is not picking up the Echo. Is its on the page though because Javascript script tags are able to pick them up.
This is my vue object:
Vue.createApp({...
- 303
-1
votes
1
answer
30
views
How to trigger a function code once when loading or refreshing page in vue js and inertia js
I am working on a project using vue JS and inertia JS, basically I wanna trigger this
code ONCE when the page loads or reloads.
router.visit('/getrequest',{
method:'get'
})
but its triggering ...
- 176
2
votes
0
answers
24
views
Cannot migrate from Google Places API to Places API(new)
I'm trying to migrate from Places API to Places API(New) using google docs but i'm getting this errors.
I'm getting this error: TypeError: google.maps.places.PlaceAutocompleteElement is not a ...
0
votes
1
answer
19
views
Puppeteer not injecting pageNumbers and totalPages using TailwindCSS
I have a TailwindCSS footer. I am trying to use the classes to inject pageNumber and TotalPages on a pdf printed, but I am not getting it right.
I have the Puppeteer API created it display the Vuetify ...
1
vote
1
answer
24
views
how to use userouter in typescript file
In my project, I've implemented a structure for managing errors and web API requests. I want any response with a 401 status code to redirect to a particular page. I've written all this code in a ...
0
votes
0
answers
14
views
How to handle the @ at-sign in i18n vuejs quasar
I got trouble understanding why this is happening in i18n variables and how its presented in the frontend:
"test{'@'}test.nu" -> quasar test -> [email protected]
"test{'@'}test.nu"...
- 521
0
votes
0
answers
28
views
Vuetify v-text-field: Duplicate Error Announcements with Screen Readers
I'm experiencing an issue with screen reader error announcements in a Vuetify form. When using a v-text-field with validation rules, screen readers (specifically NVDA) announce the same error message ...
- 43
0
votes
0
answers
11
views
How to avoid duplicate API requests from both Server and Client sides using the @tanstack/vue-query package in Vue?
I recently took over a project where the frontend uses the @tanstack/vue-query package to send API requests to the backend. How can I avoid duplicate API requests from both the Server and Client sides?...
- 1
0
votes
1
answer
25
views
Caching - watch, refs, and navigation behvior
I'm having this issue where I'm using Vue3 and Nuxt, and I need a loading function to run once everytime the user navigates to the page, but delay loading if the global data isn't available yet.
const ...
- 2,304
0
votes
0
answers
21
views
How to handle events in/from composable in Vue [closed]
I'm writing a composable that wraps an external library (specifically Uppy.io, engine only so no DOM interaction)
I can communicate with this library in several ways:
methods: the instance provides ...
- 546
0
votes
0
answers
11
views
How to add reactivity to an external library in Vue? [closed]
I'm integrating an external library in Vue (specifically uppy.io).
I'm trying to wrap this library in a component or composable, but I want to make use of the internal state of uppy as much as I can.
...
- 546
0
votes
0
answers
14
views
Why is my project not tracking changes to Vite?
Background
I have a project written in Vue and using Vite to build my app. vite build and builds my application properly, but when I run vite dev the changes are not tracked or updated within the new ...
0
votes
0
answers
11
views
Vuelidate 2.0.3, issue with validate collection
I've got problem to handle simple array of string validation. I wanted to check if they're a valid yt or vimeo links.
My rules looks like that:
const mediaUrls = ref<string[]>([''])
const rules ...
- 126
0
votes
1
answer
39
views
How does one resolve this: 'Uncaught ReferenceError: Cannot access 'NavBar' before initialization'?
<template>
<nav class="navbar navbar-expand-lg bg-body-tertiary">
<div class="container-fluid">
<router-link class="navbar-brand" ...
2
votes
0
answers
17
views
Arrow Key Navigation Not Working on First Calendar in Multi-Calendar Mode in vue3datepicker
When using vue-datepicker with multi-calendars and arrow-navigation props enabled, the keyboard arrow navigation is not functioning properly. Specifically, arrow key navigation works correctly on the ...
-1
votes
1
answer
19
views
Scroll behaviour in vue [closed]
So in vue I have an AI component, when AI answers the question and gives an answer it is stopped in the middle, I mean it gives whole answer but user needs to manually scroll down to see whole answer, ...
0
votes
0
answers
30
views
Generating EPS Files with Clipping Paths that Photoshop Correctly Recognizes as Vector Paths
I'm working on a web application (Vue.js) that removes backgrounds from images. An important component is exporting EPS files with clipping paths that are correctly recognized in Adobe Photoshop.
The ...
1
vote
1
answer
53
views
vue js unable to get values from button if SVG is present
I am using Vue3. I have a button that get the Id of user once click.
The problem is that if I place an svg icon within the button it causes the vue not to pick up the values of the data-id.. I.e
the ...
- 303
0
votes
0
answers
19
views
What is wrong with my Firebase hosted Vue.js project? [closed]
I have a Vite scaffolded Vue.js project which I am hosting in Firebase. It has been working fine for deployment, but after my last deployment I was unable to load the website. I have not changed any ...
0
votes
2
answers
40
views
How can I get @click or v-on to work with dynamically loaded data with VueJS?
So I have a div...
<div id="holdmailings">
</div>
when I click on a menu item I'm loading this into the DIV with an @Click on a menu item...
if (msg == '...
- 1,469
0
votes
0
answers
35
views
Vue modal adding chapter of same subject
<template>
<div class="container mt-5">
<div class="row">
<div class="col-md-4 mb-4" v-for="subject in subjects.subject&...
0
votes
0
answers
18
views
How to use Quasar Dialog with Hotwire Turbo?
I am trying to use Vue Quasar Plugin UI in a Rails application working with Hotwire Turbo.
Quasar Drawer works very well, but not Quasar Dialog after I click on a link, I cannot open it.
// FILE: /...
- 1,093
0
votes
0
answers
19
views
resetField({ value: undefined }) prevents the form from becoming valid after updating the field with Vee-Validate and Yup
I have a multi-step form using Vue3 and Vee-Validate with Yup. I want to reset a field to remove it from the values and then fill it again with a new value. But when I do this, the meta.valid tag is ...
- 116
-4
votes
1
answer
36
views
Vuetify Component Not Rendering & No Error Displayed [closed]
Vuetify Bug: Component Not Rendering & No Error Displayed
There is an issue with Vuetify where the register-gallery component is not being recognized, and no error is shown in the console.
0
votes
1
answer
25
views
Is there a way to determine, if the Quasar Form was modified by user?
I am using Quasar framework for Vue.js and I have a form (q-form) in a Dialog (q-dialog) component. The dialog is persistent (persistent=True), but I want the persistency to be true only if the user ...
0
votes
4
answers
54
views
Vue JS Unable to get values of data attributes
I am using Vue 3 . I am unable to get dataset values from my button:
this is the button:
<script src="https://unpkg.com/[email protected]/dist/vue.global.js"></script>
<button id=&...
- 303
-1
votes
0
answers
16
views
fixing time axis in vue ganttastic library in vue3 [closed]
ganttastic library
https://github.com/zunnzunn/vue-ganttastic?tab=readme-ov-file#quickstart
and iam trying to make the position of time axis is fixed which if i scroll down so the date will still ...
- 19
0
votes
0
answers
16
views
Nuxt layout rendering delay, content flashes
Using Nuxt 3, I'm switching from my "login" layout to my "admin" layout.
This works great except for one thing: When switching layouts, there are few milliseconds where the "...
- 617
0
votes
0
answers
19
views
vue 3 pinia testing - spying and asserting on actions
I have the following simplified pinia store:
export const useMyStore = defineStore('myStore', () => {
const doSomething = (param) => {
console.log('doSomething called with: ', param)
...
- 773
0
votes
1
answer
26
views
How to pass data to a nested page in Nuxt 3
Let’s say I have a page with a list of articles and I want to display the selected article in a nested page. Can the selected article be passed down to the nested page so it doesn’t have to be fetched ...
- 1,621
2
votes
1
answer
51
views
VueJS race condition calling a child's function after setting its props
UPDATE
This was solved using nextTick() as proposed by @Estus Flask.
import { ref, useTemplateRef, nextTick } from 'vue'
...
const handleClick = () => {
color.value = 'blue'
size.value = 50
...
- 23
0
votes
1
answer
29
views
Inline style on ListItemNodes
I'm building a rich-text-editor component in vue using lexical and taking a lot of inspiration from the lexical-playground that is using the react plugins and trying to convert them where needed.
I ...
- 13
-1
votes
1
answer
40
views
How to Handle Multiple Template Layouts Based on Domain in a Vue (Vite) App?
I’m working on a Vue app (using Vite) that has three different template layouts, and the layout should be determined by the domain the user visits.
Requirements:
If a user visits test1.com, they ...
2
votes
2
answers
93
views
How can I auto import component from @vueuse/component in nuxt 3
I'm new in nuxt 3, I want to auto import the component from @vueuse/component in nuxt 3, I have following this documentation but I still didn't get it why the auto import component from third party ...
- 89
1
vote
0
answers
37
views
Read vue data in console
I have Vue Dev Tools installed. I was going through this video
https://vueschool.io/lessons/using-vue-dev-tools-with-vuejs-3
Around 3.40m into the video, the author uses a code in the console to check ...
- 13
1
vote
1
answer
36
views
How to fix error initializing offset in vue quill
I have problem initializing vue quill to apply in a Vue3 project about a note taking function, i can make note easily but when modifying it, it return offset error everytime i click or type on the ...
- 13
0
votes
0
answers
40
views
What difference between initial state of pinia store?
This code working in ViteSSG, but not working in SPA:
export const useTestStore = defineStore({
id: 'test',
state: () => ({
val: null
})
})
Error msg: Cannot destructure ...
- 15
0
votes
0
answers
21
views
Why does pasting from Excel into Tabulator empty the data from the row after the pasted data?
I am using Vue 3.5.13 and Tabulator 6.2.1 in a project that has use cases where copying data from Excel into a table on the application is necessary. During the implementation of selectable range and ...
0
votes
1
answer
55
views
+50
How to configure vue application properly to use decorator pattern?
I'm trying to use a decorator pattern for convenience in Vue.
Here is my babel.config.cjs:
module.exports = {
presets: ["@babel/preset-env"],
plugins: [
["@babel/plugin-...
- 4,577
0
votes
0
answers
7
views
CometChat UIkit vue start conversation which user on his UID
CometChatConversationsWithMessages component: how set start conversation which user on his UID?
0
votes
0
answers
27
views
Vue 3 + Vuetify: Retain focus between radio buttons
I have a Vue 3 component with Vuetify that displays a dropdown menu with radio options. When using keyboard arrow navigation (Up/Down) to switch between radio options, I'm experiencing an undesirable ...
- 43
0
votes
0
answers
17
views
I'm trying to use @capacitor-community/background-geolocation using Ionic Vue
I'm trying to use @capacitor-community/background-geolocation using Ionic Vue but it says
Uncaught (in promise) CapacitorException: "BackgroundGeolocation" plugin is not implemented on web ...
- 13
0
votes
0
answers
22
views
AIS infinite hits, loadMore and filtered results
I want to use ais-infinite-hits on a set of results that is filtered to only show ones that contain a certain segment in the URL.
The problem is that when using loadMore with ais-infinite-hits it ...
- 1,711
0
votes
0
answers
27
views
Nuxt Vitest Error in component containing <img> tag with relative url
I'm trying to run Vitest in a Nuxt3 application and am getting the error below. The issue seems to be related to the use of a relative url in an img tag. If I remove it or replace it with NuxtImg the ...
- 2,777
0
votes
0
answers
21
views
IntlTelInput on-the-fly formatting differs between Firefox and Chrome
Given the following Vue3 code :
<script>
....
import { fr } from "intl-tel-input/i18n"
import IntlTelInput from "intl-tel-input/vueWithUtils"
.....
</script>
<...
0
votes
1
answer
23
views
Vue Router Returns 404 When Refreshing Page in Docker + Nginx Setup
I have a Vue.js application running inside a Docker container with Vue Router set to history mode. The app works fine when navigating through links, but when I refresh the page or visit a route ...
- 11
0
votes
0
answers
29
views
How do you integrate vue into dojo
I am currently working with a legacy dojo project that is quite large. I am hoping to move it away from dojo and replace it with Vue. The simplest solution is to to build a replica of the dojo project ...
- 3,748