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
114
views
Missing header in the UI - Vue.js [closed]
I need my h1 to show below my for my checkbox. It is inside of the div. Should I maybe put it outside of the .
The missing is below the Organization Fields header. It is suppose to display below ...
- 29
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 ...
- 29
7
votes
1
answer
431
views
Vue component for Game Die (dice)
As part of learning Vue and Vue Test Utils I develop some simple games. I made a simple version of craps. Because in many other games a die (or dice) is used, I decided to create a reusable component <...
- 262
3
votes
1
answer
113
views
How to make this code for efficient and better looking?
I know that if you are using too many if else statements there is a better way, I hope. Please help me learn, thank you everyone. I tried to think of a better way but just couldnt come up with ...
- 31
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 ...
12
votes
1
answer
528
views
Resizable containers with VueJS
A month ago I reviewed the code in Resizable split DIVs Vue.js, suggesting that the OP use computed properties and bound styles to simplify the code (at least reducing the need to use ...
- 29.6k
6
votes
1
answer
620
views
Resizable split DIVs Vue.js
I just started Developing Web App (Vue.js) for my company for around 1-2 months. Therefore, my knowledge and experience in HTML, CSS and Javascript is kinda shallow.
I've created a custom resizable ...
3
votes
2
answers
151
views
Health Test App, It Returns a Score Based on the Answers Given
Here is my parent component: App.vue. I was wondering what improvements I could make to the code here.
Application Description
This application was built off the Vue.js framework and utilizes a
...
- 147
-1
votes
1
answer
1k
views
Try-catch-finally snippet [closed]
Using visual studio I created a snippet which helps me surround my already written or new code into a try-catch-finally block. I use axios for REST so there had to be separate error handling method so ...
- 169
4
votes
1
answer
646
views
Grid layout component for VueJS
I'm working on a vue.js / nuxt.js project, applying the Atomic Design methodology, I need to do one to set the grid layout and using CSS Grid Layout.
I already did the component, but I think I did ...
- 41
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?
...
- 1
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 ...
- 287
4
votes
0
answers
188
views
Vuejs - input validation
I'm in a project that's currently using vue. I'm at the moment developing validations for the inputs and in a way to make them more flexible, my idea was to create an intermediate component "...
- 171
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 ...
- 167
1
vote
1
answer
65
views
2
votes
0
answers
68
views
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, ...
- 193
5
votes
1
answer
120
views
Showing events on a multi room scheduler
I write a web app that shows events on a multi room scheduler. I use VueJS for the first time on a real project.
Here, I loop through the events array every room column (two nested v-for). In jQuery ...
- 51
5
votes
1
answer
4k
views
Passing a callback to a component in Vue.js
I'm currently trying to teach myself Vue.js and I've just created my first small project: a simple todo list. While writing the component I discovered that you can't access methods from the parent ...
- 53
2
votes
1
answer
958
views
Slots and Dynamic Components
It's an exercise from a Vue.js course I'm enrolled into. The aim is to get comfortable with the Vue.js features Slots and Dynamic components. By clicking on the buttons one shall be able to change the ...
- 5,040
4
votes
3
answers
223
views
fizzbu| - Fizzbuzz with dynamic height
Here is a variation on a theme: fizzbuzz. After providing this answer recently, I decided to practice some VueJS skills with outputting the values and conditionally applying styles based on the value. ...
- 29.6k
3
votes
1
answer
457
views
Display and search through a JSON's items in Vue.js
I have put together this small application which displays data from a JSON file known as "Users" in an HTML5 table.
I use Bootstrap 3, Axios and Vue.js 2 for this purpose.
Here is the code:
...
- 623
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, ...
- 519
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 ...
- 123
3
votes
1
answer
98
views
Vue component over-complication
I'm building a date range selector, and while this works, I feel like I'm making it more complicated than it needs to be. Is there a more elegant way of writing this?
Possibly using computed values ...
- 33
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?
...
- 157
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 ...
- 121
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 ...
- 321
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
<...
- 181
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 ...
- 123
4
votes
1
answer
2k
views
D3 Updating stacked bar chart
In my data there can be different number of bars in each chart.
Here is a picture:
When pressing the button labeled change bars layout the view of the charts toggles between horizontal and vertical ...
- 163
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 ...
- 1,268
3
votes
1
answer
99
views
Using something other than form field's value in Vue
I have a form, I need to send untraslated values, but as well, I need to get translated ones from Vue to write them down in page.
For now, I ended up creating a 'shadow' property and changing it via ...
- 334
10
votes
1
answer
473
views
Card based computer game
This is a 2 player (Will soon have AI in it - I am not asking for help with AI) game with mechanics similar to the card game named Magic the Gathering.
Bear with me, this is a lot of code. If you ...
- 1,283
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 ...
- 155
2
votes
1
answer
601
views
Extracting data from vue-chartjs into an array of datasets
I have a function which returns an array of datasets for a chart written with vue-chartjs. The getter getChartData returns an array with three objects with nested ...
- 155
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 ...
- 127
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 ...
- 373
12
votes
2
answers
641
views
Vue - It's the Royal Game of Ur
Background
After learning Kotlin for Advent of Code in December, I started looking into cross-compiling Kotlin for both the JVM and to JavaScript. Then I wrote a game server in Kotlin and also a ...
- 59.7k
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 ...
- 181
2
votes
2
answers
3k
views
Calling a global popup from nested vue components
I have tons of nested Vue components that need to be able to open a global modal. To avoid having tons of listeners and emitters snaking their way all through the app, I am using VueX. The main App ...
- 611
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 ...
- 133
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
2
answers
1k
views
Dynamic List Application as first Vue.js App
Task Description:
Create a div-element and take control over it using a Vue-Instance.
Print an array of hobbies into the div-element. Provide some default hobbies.
Add a 'New Hobby' button and a text-...
- 5,040
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 ...
- 262
4
votes
1
answer
481
views
Databinding entire objects between child Vue components and the root Vue instance
I have a form in which I am collecting data from two applicants. In order to minimize HTML duplication I built an applicant Vue component that generates each applicant from a template.
Each applicant ...
- 41
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 ...
- 143
2
votes
1
answer
157
views
4
votes
1
answer
2k
views
My first animated data grid with Vue.js
Because this is my very first attempt to create a data grid with Vue, I would like to know about all misconceptions used in my approach. Whomever points to the most important shortcoming / weakness in ...
user145018
4
votes
1
answer
688
views
Vue + Vuex + Firebase serverless realtime chat
I am "discovering" Firebase and I'm trying create simple chat with Vue, Vuex and Firebase. But because I'm just starting out with Vue, I need code review or advices from more experienced programmers. ...
user145018