Questions tagged [vue.js]

Vue.js is an open-source, progressive JavaScript framework for building user interfaces that aims to be incrementally adoptable. Vue.js is mainly used for front-end development and requires an intermediate level of HTML and CSS. Vue.js questions are highly version specific and should always be tagged with [vuejs2] or [vuejs3] in addition to this tag.

Filter by
Sorted by
Tagged with
0 votes
0 answers
8 views

What is the most efficient way to validate that the user entered does not exist in the database? (Vue + vee-validate + zod)

I have the following scheme in my vue component script to validate that the email is correct toTypedSchema( z.object({ email: z .string({ required_error: "El email no puede ...
Kaerit's user avatar
  • 21
0 votes
0 answers
16 views

Pass prop to persistent layout

I have search functionality in my header and i want to pass prop products to the header in the persistent layout in order to show these products in the search and filter them accordingly, how can i ...
ahmad kharabsheh's user avatar
0 votes
0 answers
29 views

Template does not rerender after state change due to async function [duplicate]

Here I have a vue project with vite and firebase. The function for the data call is in a separate firebase.js file with lots of functions. I call 2 function in Orders.vue that do: 1: get all the ...
GoldenBags's user avatar
0 votes
0 answers
11 views

After deploying a new version to the web app should detect that there was a new version deployed. How do I implent in my vue application

I need to implement "After deploying a new version to the web app should detect that there was a new version deployed". Is this possible using service worker? How I do it? If not what is the ...
Nadun Sanjeevana's user avatar
0 votes
1 answer
12 views

VueJS/Nuxt.JS how to properly load state from localstorage using "useLocalStorage"

I am trying to use useLocalStorage from pinia, however on store's state, data is not fetched from local storage but getting the default value instead. Here is the code in my store method: import { ...
Mr. Kenneth's user avatar
0 votes
0 answers
8 views

Vue eslint custom rule: How to get typescript type for directive

I'm writing a custom eslint rule for Vue single-file component templates. I'm using vue-eslint-parser to traverse the template. Inside the <script> block I can access typescript type information ...
JacquesB's user avatar
  • 41.9k
0 votes
0 answers
35 views

Property in Pina store returns empty object after setting the value

In accountsList.vue i call the following script where i commented a lot out because im doing a serious refactor and i wanted to isolate the problem. "balance" has a proper value and is set, ...
Ivar's user avatar
  • 57
0 votes
0 answers
26 views

Alert Component does not show after triggering the same Error twice

I am currently working on a Website using Nuxt.js (Vue.js) and I am having trouble with my custom Alert Component. I created a contact-form on my website that triggers a custom notification when the ...
HenrikB's user avatar
  • 121
-1 votes
1 answer
38 views

css text animation looping

How to use animation do loop infinitely which will keep sliding & repeating non-stop and i wanna make it full screen loop but it keeps breaking when reach hello5 .... what i want is i wanna create ...
Code for life's user avatar
0 votes
1 answer
22 views

Printing with Laravel

I have a view named Details, and it gets its data from invoke method of the controller based on search criteria. I have a print button in the Details view and when I press it I want to pass the ...
Newbie's user avatar
  • 1
0 votes
0 answers
11 views

Get graphics in Vue.js

I want to create a personal web application using Django for the backend and Vue.js for the frontend, but I need to know if it is possible to use graphics in Vue.js, is that possible? In my ...
Giovanni Secondo's user avatar
0 votes
1 answer
42 views

Response body is not available to scripts (Reason: CORS Missing Allow Origin) in Laravel and Vue Js App

developing Laravel 10 + Vue Js 3 application both projects files are separately. I have following api.php login route as well Route::post('/login', [LoginController::class, 'submit']); and using ...
beoi's user avatar
  • 23
-1 votes
0 answers
19 views

why is there a router error for code that isn't in my project?

vue-router.mjs:35 [Vue Router warn]: No match found for location with path "/about-us" If I search "about-us" in vscode there is exactly 0 matches. So how am I being told that ...
Carson Foreman's user avatar
0 votes
0 answers
7 views

Event Listeners Not Working After Route Change in Nuxt3

Stack Overflow community! I'm currently working on a Nuxt3 project and facing an issue with mouseenter and mouseleave event listeners within my layout. These events work as expected on initial page ...
atom63's user avatar
  • 1
0 votes
1 answer
24 views

Vue watch issue

I have two pages and I can change the same vuex value from both of them On the first page(main page) I watch the vuex value and send a request when it changes const selectedPokemonType = computed(() =&...
Дмитрий Яровой's user avatar
-1 votes
0 answers
34 views

Render images in vue js 2.6.10 [closed]

My application has 4 buttons in a component called MenuHeader, three of which use icons from the fortawesome library and one of which uses an image as its icon. This image is saved in a project folder....
FranS's user avatar
  • 11
0 votes
0 answers
18 views

q-toggle with q-table in vue.js

I have a table with the quasar framework and vue.js, and I'm implementing a switch toggle to change if the current data row is enabled or disabled, even though I'm developing based on model driven ...
MATHEUS MAGALHAES KELER's user avatar
0 votes
0 answers
25 views

Form Checkbox behave like Radio Button in Vue JS

Description I am working on vue project. I am getting stuck about making the Checkbox behave as Radio Button. Here is the code : Components : <b-table :items="table.items" ...
github.arief's user avatar
0 votes
0 answers
34 views

why Vue.js is detected on this page. Devtools inspection is not available because it's in production mode or explicitly disabled by the author

when I run my project, I can't see the changes. Also, I am trying to enable vue-devtools in Google Chrome. But I can't enable it. the project is built by vue.js inside the Laravel and it runs by php ...
Leena Alrababah's user avatar
0 votes
0 answers
31 views

Axios get request not returning data in laravel + vue

I have an invoice page which shows the invoice rows from database using vue. I use laravel 10 with vue 3 composition api. I requested the data with axios and save them in vue ref but the data is ...
Devdek's user avatar
  • 21
0 votes
0 answers
14 views

Vue 2.7 using v-slots without <template>

I have a setup of 3 components - Wrapper, Parent, Controls I'm rendering a Parent inside of Wrapper via a slot and I want to be able to render the Controls inside a named v-slot in the Wrapper ...
Simeon Borisov's user avatar
0 votes
0 answers
6 views

PrimeVue DataTable Virtual Scroller Resetting Scroll position on data change

I'm having an issue where the scroll position resets on the data table but not on the virtual scroller component. Every time you scroll to the fetchNextPage threshold, it resets the scroll position to ...
snoop's user avatar
  • 389
0 votes
0 answers
13 views

Migrating Vue.js from a electronjs based env to Jetty

I just want to migrate my old project(in vue.js) that was served by a electron(node). I want to migrate it from vue to jetty. to make the vue part static. and the dynamic part works absly fine in java ...
Ian071102's user avatar
-1 votes
0 answers
37 views

"nuxt.options._layers is not iterable" error. What to do ? First day with vue.js

I am totally new to vue.js and I got this error while trying to launch my first npm run dev : nuxt error : nuxt.options._layers is not iterable I can't find any help about this anywhere. What to do ?...
aa bb's user avatar
  • 433
0 votes
1 answer
12 views

Porting Vue component to HTML Canvas

I've been developing a boids simulation, commonly referred to as "flocking". Initially, I rendered the boids on the screen using a Vue component without a canvas. However, I've recently ...
Jelles's user avatar
  • 38
0 votes
0 answers
21 views

404 Responses for request in Vite-Vue page deployed on Azure Blob Storage

I deployed my page on Azure blob storage using Azure Storage Extension for VS code (on my project folder i clicking Azure Section -> Storage Accounts ->Blob Conatiners->Deploy to Static ...
Wojciech's user avatar
0 votes
0 answers
13 views

useQuery data and error return undefined but network tab shows data

Hi I have a problem when trying to fetch data with urql's useQuery. Whenever I try to console.log() the data it says undefined but when I look in my network tab I can see the data. This only happens ...
Marnix Elling's user avatar
2 votes
1 answer
34 views

trying to access nested json value for v-select (itemProps) in vuetify

I am trying to make a v-select component in vuetify which get data from a API and show it as options , but the bizzare thing is the recieved json data have an object inside the object and it can not ...
Elias's user avatar
  • 301
0 votes
0 answers
7 views

useFetch to authenticate token

I have a NUXT component that just needs to authenticate a users zendesk token, would the useFetch composable the correct way to do this? I first gave this a go but looking to rewrite in the best way: ...
Pianoc's user avatar
  • 797
0 votes
0 answers
49 views

Hide Vue form using password protected post [closed]

I've created a simple theme using WordPress and Vue for a headless setup. I need to show a form that needs to be restricted using a password on the homepage. I've created a page and set it to ...
newbiedev's user avatar
  • 2,871
0 votes
0 answers
41 views

Reading data from a json file and plotting them on a chart in Vue.js (Online compiler)

I’m new to Vue.js, I’ve been trying for so long to read data from a json file, and plot them to a chart. However it doesn’t seem to work. I’ve tried fetch and get api’s. I use online compiler cuz of ...
AmerMo's user avatar
  • 1
-1 votes
0 answers
41 views

npm run build command hangs after transforming modules

I have built vue and laravel project which runs perfect locally but when trying to build, it hangs for long after transforming modules code I run npm run build > [email protected] build > ...
Mubashir Rehman's user avatar
0 votes
0 answers
18 views

Laravel Vue Inertia CRUD

So I'm making a CRUD application using Laravel, Vue, and Inertia. I have successfully made the Create feature, but I am facing a problem in the Edit. This is my store and update method in the ...
clintondave10's user avatar
-1 votes
0 answers
15 views

May I ask about the scope context of import. meta. global [closed]

I want to package my Vue dynamic routing module into an NPM packet. However, I found that when calling import.meta.glob in the npm package to dynamically obtain files, it is impossible to obtain the ...
陈立东's user avatar
0 votes
0 answers
27 views

Is there a possibility to deactivate swipe navigation on mobile browsers?

I am building a VueJS form, which has multiple steps and a back button, to go to the previous step. All steps are managed in a parent component, so the URL / router history does not change with the ...
UdoLambada's user avatar
-1 votes
0 answers
22 views

Is there a fix for bootstrap utilities problem?

I am using vue3 over vite and I am trying to implement the bootstrap to the project I was able to implement the whole thing but when I try overriding the variables related to the bootstrap I get a ...
Sparks's user avatar
  • 514
0 votes
0 answers
31 views

How do I display the result of Google's computeRoute API?

I am using the computeRoute post method provided by Google's Routes API. The method returns a JSON file with the following data : { "routes": [ { "distanceMeters&...
fadl masri's user avatar
0 votes
2 answers
39 views

Correct way of dynamically binding a tailwind classes in vuejs3/nuxtjs3?

does someone of you know, what the correct way of dynamically binding the content tailwind class in vuejs3/nuxtjs3 is? Let's assume, that const isExpanded = true <h1 :class="{'after:content-[`:...
Dariusz Legizynski's user avatar
0 votes
1 answer
29 views

Update property on object in pinia array

I'm just starting to use pinia and I have an array of objects in my state. const useMyStore = defineStore('myState', () => { const myData = ref([]); }); I want a method that will update the ...
d512's user avatar
  • 32.9k
0 votes
1 answer
34 views

Vue: proxy framework component with v-model

I want to proxy <vue-date-picker/>, which exposes a Date-based v-model in a way that it can be used with Dayjs (which we use across the app) instead. How can I achieve this? I am on latest Vue ...
Phil's user avatar
  • 7,163
0 votes
0 answers
15 views

How to wait in first child's created hook until second child's created hook route query is changed?

I have three components: parent, child1, child2. I have created() hook in child1, where I change route query: this.$router.replace({ query: { ...vm.$route.query, param1: 'var1' ...
Marat Gabitov's user avatar
0 votes
0 answers
9 views

ION Range Slider triggering multiple times If axios is used

When Axios is used in the OnFinish method, It is triggered multiple times. If I don't use Axios, there seems to be no problem. You can check the sample code below. When Axios is not used. $("#...
Mustafa Tığ's user avatar
0 votes
0 answers
22 views

ReferenceError: __VUE_PROD_DEVTOOLS__ is not defined after npm run build with Vite

I get this error when npm run build the project. This error sometimes appears, sometimes disappears after restarting the browser. Users of the site have the same problem. vite.config.js import { ...
Artur's user avatar
  • 1
0 votes
0 answers
16 views

Vue 3 Not Displaying Data from Laravel 10 Backend in Notifications Dropdown

I'm developing an application using Laravel 10 as the backend and Vue 3 for the frontend. I'm encountering an issue where I cannot display data from my notifications table in a dropdown menu in my ...
niq's user avatar
  • 113
1 vote
0 answers
22 views

How to use Vue's defineAsyncComponent on server where all Vue files have been bundled by Vite

I have a small Vue + Vite component library that I am using to render custom tables in a project. This library has a Table component that takes a config and data as props. One feature of the library ...
Clara Swanson's user avatar
0 votes
0 answers
17 views

Yarn quasar dev warning

App • WARNING • UI in ./node_modules/quasar/dist/quasar.sass Module Warning (from ./node_modules/sass-loader/dist/cjs.js): Deprecation Using / for division outside of calc() is deprecated and ...
Fuad's user avatar
  • 1
0 votes
1 answer
49 views

Error occurs when running 'npm run dev' in Vuetify project initialized with 'npm init vuetify'

I'm new in vue3. I try to use vite+vuetify3 to dev the web. I create a vuetify by using npm init vuetify and it works perfectly.Then I want to start to devlope by using npm run dev and it jump some ...
Joshua H's user avatar
0 votes
1 answer
36 views

Public directory stops serving images when hitting a specific route

I have default layouts (footer and header) for all the pages of the app: page.default.layout = name.startsWith("Dashboard/") ? undefined : MainLayout; in my footer it uses the image from ...
ahmad kharabsheh's user avatar
0 votes
0 answers
14 views

Buefy "The client-side rendered virtual DOM tree is not matching server-rendered content" after adding password field

I am using Nuxt 2 with Buefy and FontAwesome here All I did was add a /login route with a login form asking for email and password I keep getting this error "The client-side rendered virtual DOM ...
PirateApp's user avatar
  • 5,611
0 votes
0 answers
21 views

Could not find useGroup injection with symbol vuetify:v-window-group [closed]

While updating to Vue 3 and Vuetify 3 I got this error [Vuetify] Could not find useGroup injection with symbol vuetify:v-window-group I tried to migrate from Vuetify2 to Vuetify3 and encountered this ...
Mousa Abdelmaksoud's user avatar

1
2 3 4 5
2132