Category "vue-composition-api"

How to use Axios with Vue 3 Composition API

I am attempting to build a Pokemon filtered search app with Vue 3 and Composition API based on the following tutorial: https://www.youtube.com/watch?v=QJhqr7jqx

Vue 3 Composition API - How to get the component element ($el) on which component is mounted

I want to use onMounted to initiate third-party library. To do that I need the component element as its context. In Vue 2 I would get it with this.$el but not s

How to define `name` and `inheritAttrs` in `<script setup>`?

Options API: <script> import { defineComponent } from 'vue' export default defineComponent({ name: 'CustomName', // 👈 inheritAttrs: f

can't use template ref on component in vue 3 composition api

I want to get the dimensions of a vue.js component from the parent (I'm working with the experimental script setup). When I use the ref inside a component, it w

Vue 3 Composition API - How to specify a prop in setup()

I wrote a "loading state" mixin for Vue 2: export default { props: { loading: { type: Boolean, default: false }, }, data () { retu

Vue3 TypeError: template ref.value is null

how can I clean my console from the following error: TypeError: ref.value is null The error comes only with a resize event. Each time I resize the window, I re

Vue3- Using Vitest toHaveBeenCalled() method

I am running a vue3 application using the Composition API and the setup() hook. I am using Vitest as unit-test framework. (v 0.6.1) I have the following sample

How to trigger graphql useQuery on demand only once?

With the help of graphql-codegenerator we created a graphql useQuery that correctly retrieves data from the backend. When a string is entered into an input fiel

Props typing in Vue.js 3 with TypeScript

I'm trying to type hint my props in a Vue 3 component, with composition API. So, I'm doing this: <script lang="ts"> import FlashInterface from '@/interfac

How to call method in setup of vuejs3 app?

In vuejs3 app I retrieve data from db with axios in method, like : <script> import appMixin from '@/appMixin' import app from './../../App.vue' // esl

How to validate a form with ref in Vue Composition API

With the Options API, I validated my form like this: template: <v-form ref="form" v-model="valid" lazy-validation @submit.prevent> ... script: methods: {

ref vs reactive in Vue 3?

Looking at some examples of some people's preview tutorials for Vue 3. [Currently beta right now] I've found two examples: Reactive <template> <butto

Call a function from another component using composition API

Below is a code for a header and a body (different components). How do you call the continue function of the component 2 and pass a parameter when you are insid

How to use v-model on component in vue 3 script setup

I want to add a v-model on a component but I got this warning: [Vue warn]: Component emitted event "input" but it is neither declared in the emits option nor as

Vue 3 - emit is not a function

I'm having a strange problem using emit in Vue 3 Composition API + Vite. I want to make a simple emit from a child component to a parent. The code of the child:

Vue.js 3 use autofocus on input with ref inside a method

I worked with Vue2, but I recently try Vue 3. I have simple problem: <input ref="myinput" /> <button @click="submitData" /> I want to set "focus"

Extract modelValue logic to composable

I'm transitioning from Vue 2 to Vue 3 and I'm having trouble with composables. I have a bunch of components that inherits modelValue. So, for every component th

Vue 3 how to get information about $children

This my old code with VUE 2 in Tabs component: created() { this.tabs = this.$children; } Tabs: <Tabs> <Tab title="tab title"> .... <

How can I use async/await in the Vue 3.0 setup() function using Typescript

(This question has been answered for JavaScript, see below, but this question is specific for TypeScript, which behaves differently) I'm trying to use async fun

How to toggle to dark mode in Vue JS and Tailwind CSS

I want to toggle to dark mode in Vue JS and Tailwind CSS with Dark class in tailwind, but I don't have idea what I should do. I code a little and I want to try