Skip to content

Tag: vue.js

Props are not rendering inside component

I have a simple setup: I have a parent component that passes data using props to a child component. However, when I pass the props to the child component, the data is not filled in. All the tutorials and guides I’ve followed use the same syntax as I’m using, so I must be missing something. I just can’t seem to

How to download .js file by JavaScript from an url?

I know this question is asked hundreds of time in this forum, But I’m trying to download a .js file from an url in my Vue 2 application, but it’s not working. Here is what I’m trying: This downloads a file which consists nothing but the url I’ve provided to the axios post request. I’m getting API response like following:

How to handle V-show dynamically

I am trying to build an Ecommerce shopping website. I import data from JSON file and by using v-for loop I am able to print data. There is one section in each order that is Show Order Details option, after clicking it one more section called order details will show. I used v-show tag to open the details section. But

Vue3 app on vite can’t compile scss syntax

I can’t use scss nesting syntax. _table.scss table { &.table { width: 100%; } } results in dev tools I imported my _table.scss file into main.scss and main.scss into main.js main.scss main.js Here is my package.json dependencies And my vite.config.js I followed the vite API If I use simple syntax .block .block__item or use scss syntax in vue components –

How to force collapse all expansion panels?

I want to force close my expansion panel when I clicked Update How do I programmatically do that ? This is what I have in my update(). Answer Expansion panels can be controlled externally by modifying the v-model. Its value corresponds to a zero-based index of the currently opened expansion panel content. If multiple props are used then it is

Delete record from an array of objects in javascript

I have an array of objects that I get from an api, I get the data but I want to remove the ones that have a finish status after x time. First I must show all the records, after a certain time the records with FINISH status must be deleted I am using vue. This is the response I get:

Access data property of child component from parent vue 3 typescript and composition api

I have setup two components parent and child: App.vue //Parent BookForm.vue //child I’ve followed this thread from vue forum for the solution but I cannot retrieve data from child component into parent component. When I console log console.log(bookRef.value) I get undefined. What is the correct way to get child component’s data with typescript and composition api setup tag ? Answer

create a route with vue router

I have some issues creating a router using router on vuejs. My file main.js was just like the code below and then when I changed to add some routes I got the error below MAIN.JS BEFORE (WORKING WELL) MAIN.JS AFTER ERROR The pages don’t render anymore. I’ve been a while trying to fix it. Anyone knows what it could be?