All Questions
83 questions
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>
...
60
votes
5
answers
148k
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 ...
22
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 ...
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 ...
57
votes
4
answers
116k
views
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 functionality in Vue3.0 using typescript.
...
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 ...
27
votes
4
answers
48k
views
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 an "onInput" prop.
...
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:
...
31
votes
4
answers
17k
views
How to define `name` and `inheritAttrs` in `<script setup>`?
Options API:
<script>
import { defineComponent } from 'vue'
export default defineComponent({
name: 'CustomName', // 👈
inheritAttrs: false, // 👈
setup() {
return {}
},...
36
votes
2
answers
91k
views
How does Computed work in Vue 3 script setup?
I'm trying to get computed to work in <script setup>:
<template>
<div>
<p>{{ whatever.get() }}</p>
</div>
</template>
<script setup>
import {...
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 : {
...
26
votes
3
answers
23k
views
Calling method on Child Component - Composition API
I have a parent component where I need to call a method that exists in one of its child components:
<template>
<div>
<button @click="callChildMethod">
<child-...
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 { ...
33
votes
4
answers
21k
views
How to use render function in <script setup> Vue3
I use Vue 3.1.1
I am using script setup in the experimental stage with single file components.
Using the script setup, I understand defineProps, defineEmit, and useContext, but I don't understand how ...
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="" /> ...