Questions tagged [vuejs3]
Use this tag for questions specific to version 3 of Vue.js, an open-source, progressive Javascript framework for building user interfaces.
vuejs3
13,533
questions
0
votes
0
answers
22
views
Resolve cors error for Nuxt 3, for embedded app making request in project
CORS ERROR
I have an issue in my project, I understand the error, as well as I tried to find answer for it but no luck so far.
Here is my scenario:
I have nuxt 3 app, where I am embedding one of the ...
0
votes
0
answers
15
views
Vue3 Typescript Sum all values of a column in an array
I'm still very new to this programming language and I'm trying to take an array column and sum its values so I can show a total amount on the webpage.
Question #1
I was attempting to use a computed ...
0
votes
0
answers
5
views
Passing an object to a route with vue-router
Based on this from vue-routers site it seems as though you can pass an object as a prop. However, everytime I try to do this it seems to it fail saying invalid param
My route is defined as follows:
...
0
votes
1
answer
15
views
How to build a Vue web component which reflects an internal state as an attribute?
I am building a web component input which looks like this with Vue 3:
<my-input value="Search"></my-input>
How can I make sure that the value attribute is always equivalent to ...
0
votes
1
answer
30
views
Vue 3 and Vitest focus input sets document.activeElement to HTMLBodyElement in test in composition API
Given a Vue 3 component
<template>
<input id="input" type="text" @focus="handleOnFocus($event)" />
</template>
<script setup type="ts">...
0
votes
0
answers
18
views
element plus key How do I set the key for select v2 [closed]
How do I set the key for select v2 to prevent the entire visual list from being refreshed during virtual scrolling and reuse the dom using vue's diff algorithm
<template>
<el-select-v2
...
0
votes
0
answers
11
views
Where to store a frontend-environment variable in Jhipster (Stripe publishable key)
Stripe accounts come with test and prod, publishable and secret keys.
The application is generated by Jhipster.
Regarding the publishable keys, I want to pass them as environment variables to use ...
0
votes
0
answers
10
views
Vuejs Page break problem in jsPdf when print receipt
I have 2 problems, my receipt is very long and when I export the pdf it has a page break, so I am keeping pdfHeight fixed. How can I make pdfHeight calculate the height automatically and not have a ...
0
votes
1
answer
28
views
"if regex.test" doesn't works properly on javascript vuejs router [duplicate]
const router = createRouter({
history: createWebHistory(),
routes,
});
// ...
const allowedToAnonymous = [
/^\/login$/g,
/^\/signup$/g,
/^\/home$/g,
/^\/emailconfirm\/[0-9a-zA-Z]{8}$/g,
...
-2
votes
0
answers
17
views
Laravel with Inertia.js and Vue 3 performance issue when disabling hardware acceleration
hello I have a problem with Laravel Inertia with Vue 3
the problem is that I'm having high CPU usage when launching the Laravel server although I don't have much content on the website yet I have only ...
0
votes
1
answer
32
views
Transition Issue with Layout in Nuxt 3
I am facing an issue with route transitions when conditionally disabling layouts on specific pages. I have a <NuxtPage /> in app.vue wrapped in default <NuxtLayout />, which contains a ...
-1
votes
1
answer
28
views
Nested v-for for image grid
For a component in Vue I want to achieve the following layout, but exchange the img src with a path from an array of images with a v-for loop .
<template>
<div class="grid grid-cols-2 md:...
-3
votes
0
answers
28
views
Why is it that when I use a third-party packaged js file and modify its source code, the page does not take effect? [closed]
i used called maotu third-party lib [enter link description here][1] ,There are two features I don't need. I modified the source code, but it doesent't work.Specifically, on the page of the ...
0
votes
1
answer
27
views
Component is missing template or render function
This is a stupid question, but I can't figure out what I'm doing wrong.
Trying to setup CK5 in Vue and I'm running into some issues. Getting this error: Component is missing template or render ...
0
votes
1
answer
46
views
How to show data in Vue JS without click paging
I have an issue when I want to show data in VueJS. Previously I have successfully displayed "User Online" data, but the problem is why do I have to click on the page if I want to display the ...
0
votes
1
answer
20
views
Vuelidate: Validate object with dynamic keys
I have a Vue form that contains a variable-length record with a language code as key and an object with a repeating structure as value.
const form = reactive({
record: {
en: {foo: 'bar' },
...
0
votes
1
answer
27
views
VUE can not display Chinese
I want to show Chinese in VUE, so I set utf-8 in index.html
However, when I finish coding and enter "npm run dev" to run this web app
there is still messy string on browser
Why does utf-8 ...
0
votes
1
answer
40
views
Some Tailwind classes are not applied
I'm using Tailwind in a Vue3 project and I'm encountering weird behavior with some classes. For examle, I have this code :
<li class="border-solid border-l border-red-500">
In VScode,...
0
votes
0
answers
17
views
Button within Select list that makes a POST call to add a new item to the list Primevue
I have a Primevue Select dropdown list that retrieves the items from the datatable. I want to add a button to that same list that makes a post call to add another item to the datatable. Have no idea ...
0
votes
3
answers
49
views
vue3: how to access variables in <script setup> from export default
When I make a project migration from vue2 to vue3, in the vue3 script setup segment, there is a variable, but I need to access it in the method in export default part which is from vue2 project. If I ...
0
votes
1
answer
32
views
Unable to Add Product to Cart in Vue.js + Nuxt 3 + Pinia Store
I've been struggling for days to get my Vue.js application to add products to the cart using a Pinia store. My backend is built with Laravel, and I'm making API requests to add items to the cart. ...
0
votes
0
answers
31
views
EsLint in Laravel 11 + vue3 and Vite
I am getting this error:
-> npm run lint
Oops! Something went wrong! :(
ESLint: 9.7.0
No files matching the pattern ".js,.vue" were found.
Please check for typing mistakes ...
0
votes
0
answers
24
views
Result Object object when i using VAutocomplete from Vuetify
I'm using vuetify in my project and I have an object object error on all dropdown entries, the bug only occurs when there is nothing selected in the dropdown and it should come with a select ...
0
votes
1
answer
23
views
How to control vue-router and nginx
I have a fronted vue3 web application.
I am currently experiencing the following problems.
But i don't know why happened and how fix it..
I think the error is due to looking for a static file ...
0
votes
0
answers
30
views
Vue modal won't show but load perfectly fine in the web page
I'm trying to create a modal with Vue to display some information of a post so i created a component Modal.vue and loaded into the page that list all the posts, and when you click on a post you should ...
0
votes
0
answers
18
views
vue3 Generic component instancetype
<template>
<div class="record-warpper">
<div class="history">
<SessionHistory
ref="sessionRef"
v-model:sessionId="...
0
votes
1
answer
54
views
vuejs @input is getting called only after onfocusout, i want to call it when user is typing
i am trying to use @input on input field in vuejs, but the function assigned to it gets called only after user has stopped typing and the focus is out of the input field, that means it is getting ...
0
votes
1
answer
25
views
How to include highcharts in Nuxt 3.7.0?
How can I include this combination graph https://www.highcharts.com/demo/highcharts/combo-dual-axes chart in my nuxt vue application ?
I followed this https://www.npmjs.com/package/highcharts-vue docs,...
0
votes
1
answer
16
views
How can I prevent the click event of the parent card element from being triggered when clicking on the child dropMenu? Vue 3
There is a certain case card, when clicked on, the transition inside takes place
v-for="caseInfo in casesInfo"
:key="caseInfo.id"
:caseInfo="caseInfo&...
0
votes
0
answers
35
views
How to create a standalone embeddable script from an internal Vue component?
I have a Vue application, and within, I have a component, which I reuse throughout the app. It's located in src/components.
I'd now like to make it so this component can be embedded into other ...