With this div declaration: that I build accordingly to: https://v2.vuejs.org/v2/guide/class-and-style.html#Array-Syntax But the binding isn’t working (the class ‘highlight’ never applied regardless of the currentPage value). I have this model where there is the currentPage variable keeping track of the active page: How can I activate the binding of a class on an element, based on the string value of a
Tag: vue.js
Why can’t I access props within my component?
I’ve copied the Grid Component Example into a single-file component (Grid.vue). Within that component, I’m not able to access the columns prop. console.log(this.columns) always prints: [__ob__: Observer] to the log. Can someone tell me why? This works fine in their example on the page and in JSFiddle. Here’s my Grid.vue file: I’m using this component within another component like so:
global update event for Vue.js
In Vue.js, is there a way to register an event if any component updates its data? My usecase: I am modeling a RPG character via a set of Javascript classes. The TCharacter class has several attributes that can be modified: name, level, HP, magic. While “name” is a simple string, “HP” and “magic” is a custom class TResource which has
Vue2 modal in v-for list
I’m trying to implement a vue2 modal as described in the vue docs at https://v2.vuejs.org/v2/examples/modal.html. It looks something like this: While the button shows up and does pop up the modal, I get a warning that Property or method “item” is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data
How to create a tree-view in vue-js with clickable components opening up a vue-js modal?
I want to create a tree-view component in Vue-JS to display my JSON data. But I have an additional requirement where I need to launch a VueJS modal on clicking any of the data fields of JSON view. I looked up at several npm modules that does display data in tree-view but I am not sure how to modify them
Vue js iterating through data sub-properties is not working
I am new to Vue and I am trying to bind an element with a fairly complex data object using Vue with a nested component. I believe I have set this up correctly according to the documentation but I’m not seeing any examples that match my situation exactly. The error I’m getting is vue.js:584 [Vue warn]: Property or method “factions”
How make VueJS understand localized numbers?
Let’s figure a simple sum app. two inputs, a and b and a c result. we have this markup and this Vue script this works great except that I’m working with localized numbers. that means. using comma “,” instead of dot “.” and dot instead of comma . entering number with decimal places confuses vue, and it are not able
Vue js – Set alt image when image source not found
I am working on a site which has a list of products. Each product has a corresponding image. I am binding the image url to the source attribute like below. If the image is not found, I want to show a default image. I do as below in cshtml razor syntax (for reference only) How do I achieve the same
Why is a Vue function not recognized when used in computed()?
The following code (a Vue method is used in a string template when the component is mounted) works: : The one below = the above expanded to use this.perc() in a computed variable, fails with TypeError: this.perc is not a function Why isn’t this.perc() available in a computed variable? Answer It must be a function in computed property.
Vue.js v-for generated html block capturing collapse state with two way data binding
I’m trying to capture click action state (for collaps function) within html v-for generated block. To achieve this, I’m using declared data table, and it looks like state is being captured correctly. Below I’m ataching simplified v-for section, where I display state after click action. Displayed state is always false, even though after click, console.log shows table fields changes. Can