Category "vuejs3"

Vue dynamically added :ref in v-for are not shown in this.$refs

I'm new to vue.js, and I have a vue.js component that basically shows numbers from a data array when the button "Add elements" is clicked, the code is the follo

How to mock a quasar component

This is my code for a quasar component that I want to mock emits: [ "buyer-protection", ...useDialogPluginComponent.emits ] But I get the following error: Type

Quill Editor won't display v-model in input field (Vue 3)

I want to display some html, fetched from a database inside of quill editor. The html seems to be fine (displayed in <p> paragraph) and is bound to quill

How do I instrument `.vue` files using the istanbul/nyc command line

Ultimately, I am trying to instrument my Vue 3 app so that I can get code coverage that includes my .js and .vue files using the below command: nyc instrument -

VueJS - create readonly copy of a ref object (Composition API)

I am getting data from db by onMounted hook and showing object in a form. When user clicks to save, I just want to check if object data has changed or not. onMo

How to Target Object in Object in v-for

I have a list that displays all the songs in all of the artists. I am able to do this by having v-for in a v-for. However, i need the list to show a-z, I am abl

vitest test await async completion of onMounted callback in vue3 component

I'm playing around with Vitest and want to wait for the completion of a couple mocked fetches in the onMounted lifecycle hook in my component: My test: import {

VUE3 dataLabels stacked column apex chart

I want show only top total datalabels but is dublicate label dataLabels: { enabled: true, offsetY: -20, style: { fontSize: "12px", colo

PrimeVue3 MenuBar Customization

I'm using the PrimeVue MenuBar component for the Header/NavBar. I wanted to show some text in b/w the menu items. I was just able to add the text, but I need to

How to write a global store plugin?

I'm trying to make a reactive $store object globally available via plugin but am failing to make it work. store.ts: import {reactive} from "vue"; export defaul

How to make a reactive copy from props with Vue3/TypeScript?

How can I take a value (in this case, an object) outside of the props it was provided in and place it into a reactive variable without affecting the original pr

Is it possible to serve a folder other than src using Vue CLI?

The reason I ask is that I am trying to serve my nyc instrumented folder when running my tests to gain code coverage. I've been referencing Vue's documentation

When Importing Self Made Vue 3 Library Into Vue 3 Project: "Uncaught TypeError: Cannot read properties of null (reading 'isCE')"

I created a custom component library using Vue 3, and after installing it locally thru yarn and registering the components, I kept getting the following error i

vue-chartjs not able to update the chart

I'm trying to understand how can I render a chart dynamically so after I can adapt it so can I send data to it trough MQTT so I can display data in real time. T

Vue3 defineprops usage with v-model in child compoent

As I understand you can not change the props value directly in the child component. But I find out that this will work, I want to know the reason behind it. For

How to register store as global variable object?

Currently I'm using a reactive store.js like so: import {reactive} from "vue"; const re = reactive({}) export default { re } which then can be used in co

Vue-apollo subscriptions not working as expected

I am working on vue-apollo and was able to use mutations and queries, but am facing issue using subscriptions. The apollo-express server with subscriptions is w

How to setup `vite-plugin-pages`, cannot find module `~pages`

I'm trying to set up file system based routing for a Vue 3 application using Vite with the help of vite-plugin-pages. I created the project using yarn create vi

how to integrate Vue Apollo in Vue Vite project?

I'm trying to integrate Vue Apollo in a a Vite project using the composition API. My main.js file look like this: import { createApp } from 'vue' import App fro

Vue FilePond only open camera on iOS

I'm following this demo from the FilePond, copied the code to my project and it does work as expected on my desktop but doesn't work on my mobile (iOS) allowing