Tagged Questions
Vue.js is a library for building interactive web interfaces. It creates data-driven user interfaces with a simple and flexible API.
0
votes
0answers
9 views
Vue 2 - How to set deafult type of array in props
I have my Vue component, which is taking an array of objects as a prop.
I use prop validation often, especially for 'default' value feature.
in this case I have:
props: {
items: Array
}
but I'd ...
4
votes
1answer
16 views
Vue + Firebase: Users being created but logged in under other users accounts
I'm having a pretty weird issue in Firebase where if I create a new user with the same password as a previous user that new user is being created with the correct information but is being logged in ...
firebase
0
votes
0answers
31 views
How to create an online user list?
I am trying to create a real time list of all online users in Laravel with Pusher, but I don't know how to do it with Vue or anything else.
I have created an event that receives the username of the ...
0
votes
1answer
36 views
How to change upvotes and downvotes directly in databes with vue.js?
I'm dislaying my comments from databse:
@foreach($comments as $comment)
<div class="comment_list">
<div class="row">
<div class="col-...
0
votes
2answers
26 views
Sharing application store state
Im using Vue and Vuex in my application and I have some components. By the time passing I know I will probably have a few more which is gonna be a lot. So I have a problem with sharing the app state ...
0
votes
1answer
16 views
Vue.js - component that binds a binary string to checkbox inputs
In Vue.js, how would I write a component that binds to a string of 1s and 0s, such as "111001011", and represents this data to the user as a set of named checkboxes?
0
votes
0answers
27 views
+50
PhpStorm inspector does not recognize the colon symbol in XML attribute
I am trying to make a syntax highlighting for Vue.js. But it does not work with :attr, at all.
(?!v-for)(v-.*) and @[a-z].* works as well. But this does not work even like
\ automatically deleted ...
intellij-idea
phpstorm
webstorm
0
votes
2answers
37 views
How to wait for ajax call from main Vue instance?
I currently have VueJS components that makes an ajax call to github like so:
(Child) component
Vue.http.get('user/repos').then((response) => {
console.log(response);
}, (response) => {
...
0
votes
1answer
595 views
VueJS routes with component tag not working
Whenever I use the component tag which has an id of #app within the template inside my components/App.vue it returns the following errors:
// components/App.vue
<template>
<div id="app"&...
-3
votes
1answer
27 views
VueJS 2 vue-router 2 (laravel 5.3)
I am trying to link between (VueJS 2) components using (vue-router 2) router-link. When a link is clicked, the URL is not updated used in blade (laravel 5.3) i used router-link and already v-link is ...
1
vote
2answers
54 views
API-Centric app in Laravel 5.3
I want to make API (Laravel) and SPA (Vue.js) that uses this API. But I am not sure how to accomplish that.
2 separate projects (1 Laravel project for API and 1 Vue.js project for SPA)
or
1 Laravel ...
-3
votes
1answer
17 views
Vue span value from methods
I want to get the value from methods and put this value in span element
There is my pseudo code and I don't know what is the right way to do that. Maybe stored in data?
<li v-for="item in items"&...
0
votes
0answers
16 views
Vue Uncaught RangeError Maximum call stack size exceeded
when i build my vue project, browser always throw error: Uncaught RangeError Maximum call stack size exceeded, no matter it is in proxy environment or not.
versions:
*vue@ 2.1.8
*[email protected]
*...
0
votes
1answer
44 views
How to set a <div> style in reaction to a Vue.js data member change?
Summary
I would like a <div> to be square (height equal to width) when the size of the parent <div> changes due to a change of its content (which can span one or more lines).
Details
...
0
votes
1answer
21 views
Create an object from array using Vue.js
I am looking to create an object from an array adding an additional key and default value. The array below is what I wish to create.
meal_choices: [
eggs:{ selected: 0 },
...
0
votes
2answers
33 views
Vuejs js for multiple pages not for a single page application
I need to build an application using laravel 5.3 and vuejs 2, because of I need to use two way binding rather than use jquery.
I need to do views with blade templates. Now i need to use vuejs in ...
-1
votes
1answer
28 views
Vue cant load image
Im learning VueJs with rails and stucked with image bind of vue
This is the js code to create a recipes list
new Vue(
el: '#recipesCollection'
data:
recipes: [
{
name: 'aaa',
...
3
votes
2answers
72 views
How vuejs knows the depenedencies of computed property for caching?
I have this Vue.js code:
new Vue({
data:{
myValue:'x',
myOtherValue:'y'
},
computed: {
myComputed: myFunction(){
return this['my' + 'Value']
}
}
})
...
0
votes
2answers
16 views
How to submit vue-google-maps placeInput to server?
I have a form in my application. I also have a view component that creates an input field using vue-google-maps.
I use this component within my but there is no name attribute so my server does not ...
google-maps
0
votes
0answers
23 views
What is the appropriate way to change component view-model data from within a Vue.js directive?
While reading the documentation on writing custom directives for Vue, the section on Directive Hook Arguments states the following:
Apart from el, you should treat these arguments as read-only and ...
1
vote
2answers
41 views
how to clone objects javascipt webpack
//bootstrap.js
window.numToRubles = require('./custom/rubles');
//in rubles.js
(function() {
var rubles = function(number, template) {
....
return text;
...
0
votes
1answer
13 views
Why doesn't Webpack-Dev-Server (inside docker container) detect file changes when used with a new Vue.js CLI Webpack Template Project?
When starting a new Vue.js Webpack template project from the terminal with the Vue CLI (I did this inside a docker webpack container that I built with Vue CLI installed) using the documented startup ...
5
votes
2answers
90 views
+100
User registration for API/SPA
I am creating an API and a separate front-end app that will consume said API. In my particular case I'm using Laravel Passport for my API and some VueJS for my frontend app.
In order for a user to ...
1
vote
1answer
32 views
How to get vuex state from a javascript file (instead of a vue component)
I am working with vuex (2.1.1) and get things working within vue single file components. However to avoid too much cruft in my vue single file component I moved some functions to a utils.js module ...
0
votes
0answers
19 views
How to create dynamic inputs from checkboxes using Vue.js 2.0
I have managed to achieve the data movement however have two problems.
If a checkbox is changed the total stays the same and doesnt deduct the unchecked food.
Rather than adding the numbers together ...
10
votes
2answers
9k views
Call a Vue JS component method from outside the component
Let's say I have a main Vue instance that has child components. Is there a way of calling a method belonging to one of these components from outside the Vue instance entirely?
Here is an example:
...
0
votes
1answer
15 views
module parse failed when include jquery and bootsrap
I am adding SB Admin template in my .vue file,
When I include jquery.js and bootstrap.js in my main.js it returns following error:
ERROR in ./~/bootstrap/dist/js/jquery.js Module parse failed:
...
0
votes
3answers
197 views
How can I add pagination in listing page using vue js and laravel?
I have a listing page using vue js and laravel. In this page filtering and sorting functionality is also included. Currently listing, sorting and filtering are working fine. I need to include ...
0
votes
1answer
37 views
Vue.js watch a nested property inside array
I got a vue object like this:
var vm = new Vue({
el: '#app',
data: {
items: [],
index: 0
},
});
Inside items array i ...
2
votes
1answer
26 views
child not updating based on props in Vue.js
I have something like this in my parent scope:
<form-error :errors="errors"></form-error>
<textarea class="form-control" name="post" cols="30" rows="8" @keydown="errors.clear('post')" ...
0
votes
2answers
21 views
Toggle inside v-for items affects the entire list, how can I make the each toggle affect only the containing list item?
I'm making a list of items with v-for loop. Inside each item of the loop there is button with click event method that showing description text.
When i click on the button, it should toggle only inside ...
1
vote
4answers
109 views
geocomplete with Vue js — location being erased
I'm trying to use jQuery geocomplete along with Vue.js to populate a form with geo data.
My code contains this form:
<form>
<label for="get-offer-location">location: </label>&...
2
votes
1answer
29 views
Responsive SPA and VueJS
In the past, due to lacking any real CSS skill and design capabilities, I just started out with bootstrap. VueJS looks very interesting to me for my next project. I started down a path with it but ...
1
vote
1answer
21 views
element Ui: Carousel - How to set current slide
I have hard time to figure out how to use the carousel and more specifically how to set the current slide.
Here is the doc of the component
Here is the fiddle
<div id="app">
<button v-on:...
2
votes
1answer
39 views
what is the difference with Array.prototype.splice and arr.splice in vuejs?
code:（vue2.0, vue-router）
<template>
<a v-for="apiItem in allApis" href="#"></a>
</template>
<script>
computed: mapGetters([
'allApis'
]),
</script>
and ...
2
votes
1answer
78 views
Vue.js: How to map a list of keys to the actual Firebase objects?
I'm developing a small web-app based on Vue.js using Firebase to store and sync the data. I store items (e.g. with attributes title and subtitle) and lists with an attribute listitems, where an array ...
2
votes
1answer
27 views
Multiple checkboxes, bound to the same Array using dynamically cheated data in Vue.js 2.0
I am trying to recreate to use multiple checkboxes, bound to the same array to get a customers selection.
I am following the details provided in the docs.
<input type="checkbox" id="jack" value="...
3
votes
1answer
21 views
Can't use Vue.config.delimiters, can only set delimiters on new Vue()
As per this answer, I'm trying to set Vue.config.delimiters = ['${', '}'] in order to use Vue with server-side handlebars.
When I just use the global config, it doesn't anything.
When I set ...
2
votes
2answers
32 views
vue-resource get request not working on Laravel 5.3
It's a fresh Laravel 5.3 installation on MAMP.
I'm trying to fetch data from a json API endpoint with vue-resource's get request.
But it's returning an empty array.
Here's my app.js
I haven't used ...
2
votes
2answers
31 views
How to access content of slot in another child component
Following problem:
I have a Vue.js component which relies on its parent's DOM. But the moment the prop gets passed, it (this.$el) is undefined, probably because it's not yet mounted then.
My ...
1
vote
1answer
18 views
Two differed v-on:clicks within same element
So, the first v-on click works, but when I try and trigger the one below it, nothing happens. I'm assuming you can't really nest different onclicks like this? I can't just use the same v-on click in ...
0
votes
0answers
24 views
Vue.js mixin alternative using Class?
Is it possible class something like class Form instead of using mixin?
In the class Form it will have some methods and data.
The class can be used in some vue.js components.
0
votes
0answers
22 views
Vue 2 router-link issues with links
I'm having quite a few issues with this new router-link component.
For instance I have a simple pagination control.
<router-link v-for="i in _totalPages" :to="{path: _path, query: getQueryParams(...
1
vote
1answer
32 views
Pass php variable to vue component instance
How can I pass a value of a variable to a vue component?
In my example, i have an inline template client-details, i get this view from laravel so now i want to pass the id which comes with the url /...
0
votes
1answer
14 views
Clearing input in vuejs form
Just completed a todolist tutorial.
When submitting the form the input field doesn't clear.
After trying both:
document.getElementById("todo-field").reset();
document.getElementById("#todo-...
0
votes
1answer
15 views
Vue 2 router-link how to disable class all together
I have a simple router-link.
<router-link :to="{path: '/blah}">blah</router-link>
How can I remove the active class completely. I just don't want it set at all ONLY on this particular ...
3
votes
2answers
3k views
How to create a vue component dynamically
I've created a component in my vue instance.
components: {
plan: {
template: "#suggested-properties",
props: ['plan', 'active'],
computed: {
...
0
votes
0answers
41 views
DOM is not getting updated on updating VueJS data object
I have a VueJS data object in JS script. The JS script is linked at end of the page. So first HTML will is getting rendered. Then VueJS data object will be initialised. After initialising data object, ...
1
vote
1answer
18 views
How to resort components after rendering theme
lets say I have an array (of places in the map) that I loop through :
<div class="row" v-for="place in places">
<place :place="place" v-if="place.distance"></place>
</...
1
vote
1answer
19 views
Hiding Element Based on Route Path or Params in Vue
I'm trying to hide the main app navigation bar based on if the route is on a given path.
In my App.vue component, in the created() method. I do check to see if the route is x || y, if either of ...
