I saw many answers telling to use vue-devtools to access the Vue Object but is there a way to do it in the browser console? Like in the tutorial, we enter > app.data.sock in console to get the data Let’s say: main.js App.vue HelloWorld.vue How do I access the data of ‘titles’ in HelloWorld.vue? In other word, how to get
Tag: vue.js
Nuxt.js dynamic component error “Either pre-compile the templates into render functions, or use the compiler-included build”
I’m getting the following error in Nuxt.js: I was following the examples here: https://stackoverflow.com/a/39519105 and my RenderPost.vue roughly looks like this: I added the <client-only> because I was also getting error about server and client not matching up. Without it, I get an additional error that says: Answer Nuxt normally includes the Vue runtime only (excludes the compiler) as an
How do I assign an array of objects to an empty array in a Vue component?
I am trying to write my first Laravel program that uses Vue components. I am using Laravel 8.x and Vue 2.x and running on Windows 10. I’m imitating a video that shows how to do it. Unfortunately, not everything he’s doing works for me. Some people here were very helpful to me yesterday in solving the problem I was having
Search function .match() case sensitive
this.items is an array of objects. I am using this to search the items by the search bar, but .match() is case sensitive. For example, if I have an item called Milk, when I type milk, it won’t come up. How can I make this work for both lowercase and uppercase? Live demo I tried: but it gives me a
Vuetify tooltip refresh/rerender on hover
I have a vuetify tooltip component. In the tooltip I have a {{date | moment}}. I get a static a few seconds ago. I want every time I hover over the button, to refresh the button tooltip to the current elapsed time (10 minutes ago for example). I can’t figure out how to rerender the tooltip on hover with the
How to use mixins in Nuxt.js app with nuxt-property-decortor
I have used Nuxt.js in my latest project, and the language is TypeScript. Also, I’m using nuxt-property-decorator. I’m trying to understand the ‘mixins’ property in the following code. mixins.vue ↓ mixin.ts↓ I was expecting “Hello worlds!” in the output, but an error occurred: Could anyone advise me? Answer The mixin must be decorated with @Component:
Passing an array object property from Laravel in Vue
I am sending an article->tags array of objects to my Vue component like so: I get this array: Now in my component, I want to get to the name field so I can store it and pass it onwards. How can i do this? this post has the same problem, but when i try this solution: I get an undefined.
How can I formatt a value in v-for inside a el-option in element ui
I need formatt to decimal value the value in label(item.value) inside a v-for. Here is my code: I already have a function to formatt: import { numberFormat } from ‘@/utils/cells-format’ So how can I use this function to formatt the value in v-for? (Im new in vuejs) Answer You can directly use the function.
Prevent click event in Vue conditonally
I am disabling document body scroll when my mobile nav is open which is working as expected. However it was not removing the overflow hidden when user would click a link to another route/page. I created a simple method to remove the overflow hidden when a link is clicked in the nav when the menu is open, which does work
Implementing a Bl.ocks.org graph into a Vue.js component
I’m a D3 beginner and I want to use this d3 element into my Vue.js component. The problem here is that the periodic rotation I need does not work. It starts looping errors of null on the element projection that is globally defined. It seems that the first time works but in the second one the object is no longer