All Questions
Tagged with vue-composition-api vue-script-setup
108 questions
3
votes
1
answer
9k
views
Watch change in nested property in Vue 3
I have created a Simple State Management with Reactivity API
My Store file looks like the following:
import { reactive, watch } from "vue";
const state = reactive({
form : {
...
- 17.6k
24
votes
3
answers
20k
views
Use props in composables vue3
I am upgrading an app from vue 2 to vue 3 and I am having some issues with composables. I'd like to use props in the composable but it doesn't seem to be working. The code sample is pulled from a ...
- 2,828
21
votes
5
answers
32k
views
Vue | Module has no default export
I'm facing an error with vue3, ts, vue cli where it says
Module '"c:/Users/USER/Documents/top-secret-project/src/components/Features/Features.vue"' has no default export.
when importing a ...
- 11
5
votes
2
answers
14k
views
Vue 3 template refs dynamic name
I noticed that to make a template ref in Vue 3 composition api <script setup>, I should make a variable name with the exact same as the ref value.
For example in Vue 3 documentation:
<...
- 2,744
30
votes
2
answers
33k
views
How to use <component :is=""> in vue 3 script setup
I am using the experimental script setup to create a learn enviroment. I got a selfmade navigation bar with open a single component.
I am having trouble using the <component :is="" /> ...
1
vote
0
answers
75
views
How to stop executing rest of code in script setup syntax in composition api Vue 3
I have a page template that contains the following sub-component:
<template>
<ManageVacanciesAndMatchesTabVacancies @loading-data="setIsTabDataLoading" />
</template>
And ...
- 3,730
105
votes
8
answers
135k
views
How to use props in <script setup> in vue3
Just like the title says,
related Links:
New script setup (without ref sugar)
<template>
<TopNavbar title="room" />
<div>
{{ no }}
</div>
</template>
...
5
votes
4
answers
7k
views
How to target elements inside <script setup> of Vue 3 component?
How can I target the element with test class inside this vue component:
<template>
<div id="test" class="test">
</div>
</template>
<script setup>
...
- 11
60
votes
5
answers
147k
views
Vue Composition API: Defining emits
When defining custom events Vue encourages us to define emitted events on the component via the emits option:
app.component('custom-form', {
emits: ['inFocus', 'submit']
})
Using Vue 3's ...
- 45.3k
3
votes
1
answer
1k
views
Vue - Why setup with reactive when you can do it easily with data option?
I am currently building a login for a Vue app. In a tutorial (02/2021) I see that the colleague creates a setup method and imports a Vue reactive object into the component. Just to collect the form ...
- 17.6k
4
votes
1
answer
2k
views
why do I get this error when I try to use multiple defineModels in vue.js?
I am trying to use the v-model directive on two input elements. However, I am getting the following error: duplicate model name "modelValue". Below I show the code that generates this error:
...
4
votes
2
answers
10k
views
Destructure Reactive object in Vue script setup
I'm following the Vue 3 documents on how to move to using the <script setup> tags to simplify my component code.
One of the perks of using this setup is that you no longer have to use the export ...
0
votes
1
answer
4k
views
Vue watchers and reactivity
In my vue app, I want to watch route changes, and then react to the change. Here is an example where I simulate a route change.
<script setup>
import { ref, watch } from 'vue'
import { ...
- 25
1
vote
1
answer
48
views
Component isn't updating from computed value [duplicate]
I have a generic component linked to a computed value to simulate routing.
There is a current page property, and three links, whenever the user clicks on a link, that property gets updated via the ...
- 25.2k
7
votes
1
answer
11k
views
How to use defineModel (in Vue 3.4) for uses other than inputs
The examples given for defineModel in the Vue docs all relate to uses for data inputs. I was wondering if this construct could also be used elsewhere, thus avoiding the somewhat cumbersome props/emit ...