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
2answers
34 views
Page doesn't start at the top due to height of div
I am currently working with Vuejs and routing to other pages. For my link to photos, I would like a main cover photo that covers the entire screen.
<template>
<div id="album-container"&...
0
votes
0answers
25 views
Force click to be assigned to parent element
The element (+) below is hijacking the dashed div's click event handler, leaving me without access to the div's attributes.
I would like to assign all clicks within the div, to the div.
Using Vue.js
...
0
votes
1answer
11 views
Share templates between React/Vue.js and PHP + HAML
I'm choosing frameworks for my next project and got stuck on a tricky problem: How to share templates between server-side PHP and client-side Javascript?
On server, my application is going to be ...
0
votes
0answers
7 views
Component rendered as comment in VueJS + JSPM
I tried to build simple app using jspm with vue.js.
This is my html file:
<html>
<head>
<script src="bundle.js"></script>
<!--script src="jspm_packages/...
0
votes
0answers
21 views
Should I keep every component in separate file? (vue.js)
I'm using vue.js and have a timer/stopwatch component which has the following parts built as separate components. Every component/part has its own file.
digital clock,
note,
controls,
a couple of ...
0
votes
0answers
26 views
vue.js, vue-router push wont work
to get in touch with vue.js i try to build a very simple survey application. But i have an issue with the vue-router i cant figure out my self
Here the routes i defined:
const routes = [
{ path: '/...
3
votes
0answers
22 views
When creating a new VueJS instance, does it clone all the child elements in it's specified root element?
Take this HTML for example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdnjs....
0
votes
1answer
11 views
VueResource Vue.http.get Response Status Code 0
im having this issue where i send a request to the API to retrieve all users, the login function is called(index.vue) when called it tries to go to api/users/all which in this case should return all ...
2
votes
1answer
43 views
Bind class to a slot in Vue.js 2
I'm trying to create a reusable component for iterating over items, filtering them, and adding some classes to the slot (if the item is even, odd, first, last etc..)
Here's my reusable component:
&...
1
vote
1answer
18 views
Validating input with vue.js - what does v-model.number really mean?
If I have specified that my input field is numeric, with v-model.number, what assumptions can I make for validating the numeric input prior to form submission (or rather, posting JSON to the server)? ...
0
votes
1answer
27 views
Linking v-model in child to parent value vue js
I have a vue component which is as follows and in the child template I have a text input which I want to use v-model to link it to a var in the parent. But its not working.
How would I be able to ...
0
votes
1answer
27 views
Vue.js: List does not update when using child component
I'm having an issue when using a child component, a list does not update based on a prop passed into it.
If the comments array data changes, the list will not update when it uses a child component &...
0
votes
0answers
34 views
Vue.js simple script don't work
I'm trying to run the code bellow, which is probably the most simple example of Vue.js, but it doesn't work at all:
<div id="app">
{{ message }}
</div>
<script>
var app = new Vue({...
0
votes
4answers
25 views
vue 2 parent get children component data
I'm using vue2 to develop my project.
When the component mounts (or beforeMounts), it fetches initial data from vuex, and put it to component's data. After the user clicks the button, it triggers the ...
2
votes
0answers
29 views
why pagespeed insights asks me to fix “blob” compression and cache?
I know how to use compression and cache.
But what is blob and where does it come from?
blob:http%3A//35.156.214.49/34f97ab7-9c39-422a-9695-81f09dc0664b
You can see for yourself here:
https://...
0
votes
0answers
41 views
Why is my view not rendering data from my vue component?
I am trying to get a list of products from an api with a mixture of vue components and the vue-router setup. I am able to console.log data out inside the function that gets the data but I am unable to ...
0
votes
1answer
24 views
Load Vue view-model with data from existing HTML
I'd like to use Vue with pre-rendered HTML. In the long run we might not, but for now it seems easier to leave the server code in place and use Vue to manage the client logic of the web app.
I can't ...
1
vote
1answer
15 views
Avoid adding reactive properties to a Vue instance or its root $data at runtime - declare it upfront in the data option.
I am a bit confused using VueJS2. I added a few variables to the data container for sending it to my API. That works fine but Vue is throwing me a warning/error message which I don't know how to solve:...
2
votes
1answer
29 views
Vue.js: Uncaught (in promise) TypeError: $set is not a function
I'm fetching comments from the reddit API and trying to update an array with $set so it can update the view, but I get this error:
Uncaught (in promise) TypeError: $set is not a function
VM ...
0
votes
1answer
25 views
Vue update side navigation automatically
I've got names for 10 users in my sideNavigation.
I fill them in sideNavigation.js like this :
data: () =>({
name1: "",
name2: "",
name3: "",
name4: "",
name5: "",
name6: "...
0
votes
2answers
35 views
How to add event listener to <router-link> component, using “v-on:” directive? (VueJS + Vue-router)
My code doesn't work. Maybe I do something wrong? Code purpose was to generate custom event 'appSidebarInlineButtonClick' on "click" event:
<template>
<router-link
:to="to"
...
0
votes
1answer
31 views
v-if and v-else shows while page is loading?
Problem is that both divs shows on load. I tried to use v-cloak only on one but its not working. If i put on parent div then its not look good while is hidden. Any suggestion how can i display only ...
0
votes
0answers
20 views
On-demand rendering of precompiled Vue.js components (webpack 2)
I'm trying to on-demand render vue components. Application consists of 4 parts, each should be rendered to the DOM only after calling some function, something like renderProducts()
I'm using webpack ...
0
votes
1answer
43 views
how to pass object vuejs
In My laravel + Spark + Vue js project, I have used https://github.com/Vanthink-UED/vue-core-image-upload, They have code like
export default {
props:{
cropBtn: {
type: Object,
default: ...
0
votes
1answer
32 views
Pass object on other component Vue js [on hold]
I'm beginner in Vue.js and I'm kinda confused how to pass an object in other component...
My problem is I have two component file named Component A and Component B.
Component A has three buttons and ...
0
votes
1answer
20 views
Setting value in vue.js select gives `undefined` value
When vue component receives update via websocket it sets new value for <select>.
Related code
window.VueBus.$on("updated", (channel, key, value) => {
let ...
1
vote
0answers
26 views
How to make a sidenav below the toolbar in vue material?
So I am using vuejs with vue-material and I have a problem.
So this is what it looks like without the fixed sidenav.
And when I add a sidenav..
As you can see the toolbar is under the navbar which ...
0
votes
3answers
57 views
Vue.js create dynamic AJAX response based multiple components
I am trying to create an SPA using dynamic server response.
For e.g. data returned is:
components: [
{
name: "Parent1",
data: {...},
children: [
{
component: {
...
1
vote
1answer
31 views
VueJS dynamic property name not updating value
I am trying to implement an associated array combined with accessing the property within the value, the key is based on the value of the campaign object.
<li v-for="campaign in campaigns">
&...
1
vote
1answer
33 views
Limitations of beforeRouteLeave?
I'm using Vue.js with vue-router, and have a question about the 'beforeRouteLeave' navigation guard. I am using it for dirty-checking of a product object in my ProductDetail component, when the user ...
0
votes
2answers
30 views
How to best tackle sharing of state between components in same view
I have a projects view that contains 3 components, <project-item>, <project-list> and <project-view>. All of these components need to be aware of the selected projects.
<project-...
1
vote
1answer
30 views
vue - select option change triggers vuex mutation error
I'm using vue2.
I want to get select option object in v-for
HTML:
<select
class="custom-select"
@change="onPlanSelected($event)"
v-model="selectedPlan.objectId">
...
-4
votes
1answer
58 views
Why is my route returning 500 error?
I'm trying to write my first Vue component and make it post some data to my Laravel backend. For some reson the post returns a 500 error. Why is this? And yes, the csrf token is part of the headers ...
3
votes
2answers
30 views
How to change a specific (this) button class when click on. Using Vue.js 2.0
When clicked the any of the buttons they are all turns active. So what i want is just the clicked one should be changed.
var vm = new Vue({
el: '#toolBtns',
data: {
isActive: false
},
...
1
vote
1answer
14 views
Unable to access values in VueJS template
I can't access the user's email in my template. Here's what I did:
Vue.component('officemates', {
props: ['officemate'],
template: '<li>{{ officemate.name }} | <a href="{{ officemate....
2
votes
1answer
48 views
Having trouble adjusting height of the div items when overlaying a grid on an image
I'm using Vue.js & vuetify to make a SPA.
I have a component that has a background image onto which I'm overlaying a grid. The image adjusts its aspect ratio when I change the width of the page....
0
votes
1answer
20 views
Having to explicitly remove '.key' before setting/updating data in Firebase
I've created a Vue/Vuefire component for editing an existing Widget and saving the edits to Firebase.
There are some reactive properties on the Widgets that should not be saved to Firebase, like ...
firebase
2
votes
1answer
18 views
How do you realize the “in-out mode” transition effect when using dynamic route matching in Vue.js?
Is it possible to make the transition effect operate in "in-out mode" by dynamic route matching of Vue.js?
I would like to have a professor if possible.
When I had this trouble, I was able to find ...
0
votes
1answer
25 views
Vue.js v-for items won't render
New to Vue js and I'm building my single page app here: fiddle. I'm having trouble with my for loop (I believe).
const store = {
items: [{
todo: 'Clean Apartment.',
},{
todo: ...
2
votes
1answer
27 views
Listening for multiple keyup events in Vue 2.0
I am developing a messaging app and i need to list multiple event listeners for the message box (textarea). When the user press enter (@keyup.enter), the message will send automatically. However, we ...
1
vote
1answer
24 views
Vue.js 2.0 Dynamic Props Docs
js 2.0 and I'm stock in dynamic props.
See Image attached
My HTML code like this:
<div id="app">
<div>
<input v-model="parentMsg">
<br>
<child v-...
3
votes
0answers
53 views
How to work with Typescript in .vue files using VS Code?
I'm using Visual Studio Code, Vue 2 (webpack template) and Typescript.
This is my App.vue component:
<template>
<div id="app">
<navbar></navbar>
[content ...
2
votes
1answer
29 views
Vue.js - event handling with on-mouse-click down (and not up)
With Vue.js 2 when I add in an @click event to an element and attempt to click something, the event isn't triggered until after I have completed my click (press down -> up).
How do I trigger an event ...
1
vote
1answer
24 views
How to use router in actions.js of vuex?
This is code from main.js where I`ve configured my router
enter code here
const router = new Router({
routes,
mode: 'history',
saveScrollPosition: true
});
sync(store, router);
const ...
0
votes
2answers
23 views
v-bind href Retargeting to Localhost INSTEAD of Actual Link
The current button is binded to the data from v-for="book in books". The url in the database is equal to www.google.com.
<md-button v-bind:href="book.url" target="_blank">SEE ORIGINAL</md-...
0
votes
0answers
22 views
Database Saving Issue Vue.js and Rails
I'm trying to create a nested form using Vue.js inside a Rails application. I'm using a nested form to save ingredients to a recipe. Right now everything in the ingredients saves but the name of the ...
0
votes
0answers
36 views
laravel 5.3 and Vuejs Ajax call on select box
i want a newly added record to be viewed on a select box once a new record has been inserted in the table, here is my laravel html code
<div class="form gorup">
<select class="form-...
0
votes
1answer
35 views
Vue router - Handle query params
I have a <search-bar> component that have some dropdown that i will use as filter search. When I press the submit button i run the following code:
search() {
let query = {
status: this....
0
votes
1answer
48 views
Access to props inside javascript
I just start to learn vuejs 2 but I have an issue, I'm passing a props to a child component like this :
<div class="user">
<h3>{{ user.name }}</h3>
<depenses :user-id="user....
0
votes
1answer
40 views
Vuejs form submit not working
I want to submit the values in my form but each time I press the submit button I get the following error:
Uncaught TypeError: login is not a function
at Object.submit [as fn] (eval at Yr (vue.min.js:...
