Questions tagged [vue.js]
Vue.js is an open-source JavaScript framework for building interactive web interfaces. It creates data-driven user interfaces with a simple and flexible API.
106 questions
2
votes
1
answer
167
views
Ecommerce site shipping data
I have a REST API using the Laravel framework and the front-end uses the Vue.js framework. It is a dashboard for an e-commerce store where you can connect to a post shipment service API to upload ...
2
votes
1
answer
2k
views
HTMLAudioElement sound delay on keyboard clicks
I am using Vue.js to play mp3 sounds on keyboard clicks. Even though each mp3 is less than 40 KB, there is a 95ms delay on heroku, on each request.
Is there a way to download sounds when dom is ready ...
2
votes
1
answer
347
views
To-do app front-end in Vue 3
I have put together a To-do Application with the Slim framework on the back-end (API) and a Vue 3 front-end. I added a demo on my YouTube channel.
In the main App.vue file I have:
...
2
votes
1
answer
224
views
Using setInterval() to make data reactive
I have a video component passing data from an async GET request to a child component:
...
2
votes
1
answer
105
views
VueJS ReST Client: Vuex Store Methods
I'm writing a ReST API Client Tester using VueJS.
I'm trying to have a really clean code, But I feel like it's too much,
Here is my store.js file, which I use it ...
2
votes
1
answer
479
views
Vue Star Rating Component
I am wondering if someone can do a code re"vue" specifically for my star rating component ([complete code available on github).
I am looking for feedback on best practices, any glaring code crimes I ...
2
votes
1
answer
318
views
create static page with vuejs
I have a static homepage with some routes and thought about creating this with VueJs. I am totally new to this and just know NodeJs with Handlebars. So normally I would have something like this
<...
2
votes
1
answer
113
views
Use vue components as one-offs in layout scaffolding
I've recently been getting into VueJS and CSS Grid. In the past I've always used frameworks like Bootstrap to built up my layout. However, since CSS Grids and VueJS have caught my attention, I'm ...
2
votes
1
answer
2k
views
Vue.js component for adding/removing items
Simple Vue.js component, where you can add a wrestler via an AJAX endpoint, and remove a wrestler from an AJAX endpoint.
Any notes on whether I’m doing this the “Vue.js way” or tips for improvement ...
2
votes
1
answer
8k
views
VueJS to do list - handling clear event on input
I made a basic to-do list in VueJS, but it feels really clunky and obtuse to me. One of the key things is that if the text input value is empty and the user clicks the button labeled submit then it ...
2
votes
1
answer
4k
views
Custom checkbox validation on submit
I have the code below which is working as expected. It is doing a form validation with Vue.js and Vee-Validate. It is checking that at least one checkbox is checked.
I only don't like that I have to ...
2
votes
1
answer
105
views
Iterating through a list to generate calendars
I'm iterating through a list to generate calendars, the issue is each generator function has the same this.addToCalendar() function. I'd like to know how I could ...
2
votes
1
answer
66
views
Vue.js dynamically passing in functions [closed]
I have a jsonArray.js file
...
2
votes
1
answer
172
views
Array of random values that changes over time
I had a project with repetitive HTML, JS code blocks in which should be ten fields (A, B, C...) with certain functionality. Three fields are already implemented, but I don't want to copy and paste ...
2
votes
1
answer
154
views
Rendering JSON arrays of unequal length as a table
I have a website where my users can create "table-like" layout dynamically. So imagine that my users can upload a text document, and then append columns to the document, and the output will then be ...
2
votes
1
answer
2k
views
Editable table admin panel using Vuejs & Datatables
I'm trying to learn Vuejs and started this project:
https://github.com/GhitaB/datatables-admin
(Live demo: https://ghitab.github.io/datatables-admin/).
Copied the current version (the question will ...
2
votes
1
answer
61
views
Nesting of paragraph with headings and cite with dynamic content in a VueJS app
Background
I added a few items to a codepen that displayed a list of beers. One of them was the citation of the brewer who gave tips. Previously the tips were just generated into a ...
2
votes
1
answer
832
views
Using Vue to help form validation with weight for age
I am refactoring a very old web page which calculates bolus and infusion drug doses for children from premature through to young adulthood.
One of the most common drug errors is accidental 10 fold ...
2
votes
1
answer
178
views
Vue.js application, which fetches and displays list of seminars
I have a working application, which fetches list of events (seminars) from rest API. Functionality is quite simple: display list of seminars with possibility to filter upcoming/occured/all. The ...
2
votes
1
answer
141
views
Thumbnail caption in vue.js with possibly missing fields in caption
I am using the following to output a thumbnail with text. It works fine but I don't like having the use a conditional to check every prop before outputting.
E.g. this.post.user.name would indicate "...
2
votes
0
answers
57
views
Keyboard Tester Web Application in Vue 3 + TypeScript
I'm working on keyboard testing web application. As a mechanical keyboard enthusiast, I need to test that all the keys on my keyboard work whenever I build one, or change the firmware for one. ...
2
votes
0
answers
405
views
Vue 3 composition API typescript using ref in Object
Hi I using Vue 3 with Typescript. In my code I have variable:
...
2
votes
0
answers
480
views
Vuejs Dynamic inputs and displaying data
I am accepting dynamic input from the user if they have any i.e - Children/Siblings/Previous Employement etc through Vue Components.
A form is created and they input their data which is validated and ...
2
votes
0
answers
28
views
Localization of multi style text element in Vue
After following up this question, I'm thinking if there's a better/shorter way to write this text element that has part with different style, while allowing localizations:
...
2
votes
0
answers
68
views
Vue.js Computed Property Filtering [closed]
I have a Vue.js computed property as follows.
...
1
vote
3
answers
304
views
Class constructor with async properties set from poke-api
So, this is for a clicker game I'm trying to build with Pokémon data drawn from the PokéAPI. Since I'm using Vue.js for the project, ...
1
vote
1
answer
395
views
Movies App with Vue 3 and TypeScript
I have made a Movies App with Vue 3, TypeScript and The Movie Database (TMDB) API. For aesthetics, I rely on Bootstrap 5.
In src\App.vue I have:
...
1
vote
1
answer
65
views
Remove excessive recurrent code from store and computed
I have three getters in my store:
...
1
vote
1
answer
854
views
Which of these two Vuetify Navigation Drawer prevent prop mutation workarounds seem better?
I am very new to Vue.js, I just stumbled on a very hard thing to do (at least for me) where Vue was complaining about mutating a prop (children shouldn't change parent props apparently). I was about ...
1
vote
1
answer
521
views
Displaying a conflict marker
I'm displaying a conflict marker for each actor for each day, if the current day is in their conflicts:
...
1
vote
1
answer
76
views
Listening to bootstrap 5 events in a vuejs application
Starting out with VueJS, making a small fun project. The project is a simple static portfolio website, with a navigation bar at the top and a bootstrap scrollspy, jumping to the different sections (I ...
1
vote
2
answers
227
views
Virtual scroller Vue component
Problem
The scrolling looks smooth on Windows, but very laggy on Linux (Webkit webview and Webkit browsers).
Any thoughts on what could be optimized or what's obviously broken?
Demo playground:
https:/...
1
vote
1
answer
75
views
Navigating a javascript object (previous and next)
I am using Vue3 together with Collect.js. I have an object records that can have n number of items.
On my website, I display ...
1
vote
1
answer
293
views
Vue and JSONPlaceholder application
I have put together this small application that uses the JSONPlaceholder API and Vue.js.
The application crosses users and posts and displays the posts by user (author):
...
1
vote
1
answer
84
views
Draw shapes using the Html5 Canvas api
A while ago I decided to start working on a project that will keep me busy for a while and will help me sharpen my programming skills.
I do not underestimate the work behind apps like adobe xd, sketch....
1
vote
1
answer
302
views
Creating CAPTCHA in ColdFusion then showing image in Vue.js
I am trying to create a CAPTCHA image on ColdFusion. ColdFusion will be producing REST services and hence will have to push the image via JSON. I want the image to be self contained. I don't want to ...
1
vote
2
answers
307
views
Vue GitHub user lookup
I have made a small Vue app which fulfills the following user stories:
Given I make a search for an existing GitHub user, then:
The user's username is shown
The user's avatar is shown
The user's most ...
1
vote
1
answer
325
views
Chaining backend calls from VueJS method using Axios
This is the first ever bit of front-end code I have ever written, I have tried to adapt the existing call that is there to the backend using axios, so I check on of the response object value using the ...
1
vote
1
answer
159
views
Show progress bar for different states
I have this working code which shows the progress bar based on different states ("not-started", "progressing" and "done"). Each state will have its own class.
I notice it ...
1
vote
1
answer
203
views
Vue.js todo app
I am working on a small to-do app with Vue (v 2.x.x). I list 5 todos from jsonplaceholder initially.
I can add more todos, delete them or mark them as done.
...
1
vote
1
answer
39
views
Loop Vue2 tag with keyup + modifier and click
I have following code but wonder if I can loop it instead of copy-pasting.
calculator.ts
...
1
vote
1
answer
250
views
Vue.js Stoplight app - Dynamically changing classes on elements
I recently started delving into Vue.js, and decided to try my hand at some custom class/style bindings, so I made a small app that's supposed to cycle through each "light" of a stoplight (red, yellow, ...
1
vote
1
answer
5k
views
Dispatching Vuex getter via setInterval
I am fetching the friend list for a chat application using a Vuex store. I need to dispatch the getter via an interval. Is there a best practices way to do this?
...
1
vote
1
answer
153
views
duplicated operator(or attribute) on the same input control - v-model and @change
I wrote a code like below - It is nuxt.js, which is one of the Vue frameworks. This code will be expected to
When change event triggered, update ...
1
vote
1
answer
2k
views
Vue.js: extracting data from a nested object using for...in
I have a getter in my vuex module which gets data from a nested object, then check if there is any key match to the string and push these matched objects into an array. ESLint says that ...
0
votes
1
answer
109
views
Good approach to simple state management in vuejs for multiple instances [closed]
I am learning Vue.JS and I'm creating a simple todo app, where each list has a unique id. I am iterating through all of the list to create a Vue instance:
...
0
votes
1
answer
423
views
Vue.js v-if for a checkbox selection of data from a csv [closed]
I'm creating an option checkbox for an Organization data only if they have Organization data to submit from their CSV. I am creating a <div> and my ...
0
votes
1
answer
86
views
Function that checks two objects with same fields and assigns old non-null values to new object if new values are empty or null
I have a function that checks two reference objects. They both have the same properties.
The purpose of this method is to ensure that any non-null old values are not overwritten with null or empty ...
0
votes
1
answer
75
views
How to refactor switch statement with convoluted if chain within vuex module
So this is my scenario. In my Websocket Vuex module I'm dealing with all the data coming from the server. I can get different kinds of notifications from the server and according to the type of ...
0
votes
1
answer
62
views
Repetitive then/catch method on Javascript [closed]
I have this function and looks ugly because there are a lot of "catch" doing the same. Any idea how to make it better?
...