Code Review

Questions tagged [vue.js]

Ask Question

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.

77 questions
Newest
Active
Bountied
Unanswered
Filter by
Sorted by
Tagged with
5
votes
1answer
268 views

Best way to do unknown number of nested v-for loops, or how to do while loops in VueJs (is there a “v-while”?)

I want to recursively use a Vue component for each item in a multidimensional array, which is a list of topics. For example, Topic 1 can have subtopics 1.1, 1.1.1 and 1.1.2, but topic 2 might have no ...
4
votes
0answers
37 views

Very basic Vue todo list viewer

Problem I keep trying to use various todo lists. But I keep coming back to the same situation; not having an active todo list. This can come in two forms: I don't have a habit to open bespoke ...
2
votes
1answer
31 views

Multiple audio player - arrow keys & space

I am creating a VueJS component of an audio player. I am having some difficulties in finding the ideal way to get the arrow keys and space bar to work. I have found a solution, however I think it is ...
2
votes
2answers
108 views

Structuring code logic for events on laravel controller

The code below will store a base64 image on another website and create an event to display the image on a Vue page in real time. It works fine and all. My question is, is this a good way of doing it ...
6
votes
1answer
67 views

Team scrambler VueJs

I wanted to do a very little project of a team scrambler. There are two teams of 5 players. Each player has a unique color (in his team) from a limited pool. You can use 2 actions : Scramble the ...
5
votes
2answers
91 views

Implementing Laravel old data in Vuejs

Users input their pin-code which is checked against the database and returned with the locality, district and state associated with that pin-code. Multiple localities may be returned so the options ...
2
votes
1answer
44 views

Vue.js dynamically passing in functions [closed]

I have a jsonArray.js file ...
2
votes
1answer
46 views

Client side authorization when retrieving from server

I have an endpoint to retrieve the user's authorization based on Joseph Silber's Bouncer. I have a global can() function. It creates a unique key based on the ...
2
votes
0answers
46 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
1answer
56 views

Using setInterval() to make data reactive

I have a video component passing data from an async GET request to a child component: ...
-3
votes
1answer
70 views

Is there a means to combine the similar chunks of Vuejs code shown below? [closed]

I am currently working on a project and very recently came across Vuejs. I used it to create a dynamic form on my frontend, however, the approach I took does not seem right to me. Could someone take a ...
11
votes
5answers
1k views

Vue.js search functionality

In my BlogList.vue component I made a search input field: ...
4
votes
1answer
45 views

Protecting Vue page based on the API response

If the user/visitor has access to the API route, then the status code will 200, else 401. I know that I can user Vue navigation guards, but I will need to use Vuex. This way is much simpler and faster,...
2
votes
0answers
17 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: ...
0
votes
0answers
31 views

Vue.js in legacy web application

I'm working on modernizing legacy ASP.NET WebForms site which heavily relies on doing AJAX request for client-side rendering. Without the use of vue-cli compiling <...
1
vote
1answer
16 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 ...
2
votes
0answers
31 views

Progressive bar service in Vue

I am learning Vue after working for some time with Angular and I'd like to hear experienced programmers concerning the implementation of my Progressive Bar service (in Vue it's called Plugin). The ...
2
votes
1answer
126 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
1answer
27 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 ...
0
votes
1answer
59 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 ...
6
votes
1answer
124 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 <...
3
votes
1answer
67 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 ...
1
vote
0answers
19 views

Editable Data Table for Assigning Helpers to Drivers

I am just learning Vuejs and I am implementing it in a 'legacy' environment where jQuery, Bootstrap 3, among other libraries are loaded by default. In my implementation I try to keep it simple with ...
2
votes
0answers
59 views

Ecommerce site shipping data

I have REST API written on laravel and front end on vue.js. It is a dashboard for an ecommerce store where you can connect to post shipment service API to upload order shipment data and get tracking ...
7
votes
0answers
95 views

Resizable containers with VueJS

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 ...
6
votes
1answer
159 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
2answers
97 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 ...
-1
votes
1answer
240 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 ...
4
votes
1answer
141 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 ...
0
votes
1answer
37 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? ...
2
votes
1answer
52 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 ...
4
votes
0answers
115 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 "Group ...
1
vote
0answers
141 views

vuejs vuex element-ui used to toggle a login dialog but req

I have a login dialog working in vue js with typescript. I want to trigger the open via a button on page, but also by toggling a value in the vuex store. It is working by 2 watchers: Watching the ...
0
votes
1answer
41 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 ...
1
vote
1answer
40 views

Remove excessive recurrent code from store and computed

I have three getters in my store: ...
2
votes
0answers
53 views

Vue.js Computed Property Filtering [closed]

I have a Vue.js computed property as follows. ...
1
vote
3answers
143 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, ...
5
votes
1answer
88 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 ...
1
vote
0answers
77 views

Spawning multiple child processes to preview Vue.js projects

Context: I'm making a Codepen-like app but I want it to support sophisticated JS libraries/frameworks like Vue or Angular 2+ for example. I want to have a live preview of my snippet which updates in a ...
5
votes
1answer
485 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 ...
2
votes
1answer
340 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 ...
3
votes
3answers
140 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. ...
3
votes
1answer
116 views

Display and search through a JSON's items in Vue.js

I have put together this small application that displays a "Users" JSON in an HTML5 table. I use Bootstrap 3, Axios and Vue.js 2 for this purpose. Here is the code: ...
1
vote
1answer
72 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, ...
2
votes
1answer
63 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 ...
3
votes
1answer
72 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 ...
1
vote
1answer
3k 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
1answer
254 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 ...
1
vote
1answer
40 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 ...
2
votes
1answer
122 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 <...

1
2