Does anybody here have experience with Vue 3 Render Function? I don’t know how to set up the v-model and on clicks, the documentation on Vue 3 somewhat kinda useless and lacks practical usage examples. Maybe someone has a sample code? Answer If you want to emulate the v-model directive in the render function try something like : which is
Tag: vuejs3
Data rendered on the screen but has error on the console (Firebase with Vue): Uncaught (in promise) TypeError: Cannot read property ‘contents’ of null
I’m trying to get lesson.contents to render on the screen but I have some errors on the console. Here is the code (I’m using Firebase with Vue 3) Then I have this error: What I’m confused is that I’m still able to render lesson.contents on the screen: I’ve been trying a few hours trying to fix it but I could
Vue 3 Composition API: using props as initial value for component data
So I am building a search page in Vue 3 using the composition API. I have a component which takes a set of data from the parent and shows a snippet of the data including where the keyword is, and so it needs to make a working copy of this data to make a displayable value. I had a lot
Vue 3 Event Bus with Composition API
I have setup mitt and trying to dispatch event to another component but I am having hard time because in the setup() method it doesn’t have this for accessing app instance. Here is what I tried: And in the component, I want to dispatch an event As this doesn’t exist, I can’t access the .emitter. What am I missing? How
Watch child properties from parent component in vue 3
I’m wondering how I can observe child properties from the parent component in Vue 3 using the composition api (I’m working with the experimental script setup). I want to understand how I can watch changes in the child component from the parent component. My not working solution is inspired by the Vue.js 2 Solution asked here. So I don’t want
Importing a function in Vue 3 setup
Currently, im trying to call a throttle/debounce function in my Vue component, but every time it’s called a Uncaught TypeError: functionTD is not a function si throw here is my code. useThrottleDebounce.ts and this is when it’s called inside setup in my component Answer The issue is that useThrottleDebounce doesn’t return a function, therefore functionTD is not a function:
Vuex 4, State is empty in component
I am trying to access subjects store state using this.$store.state.subjects inside my home component however it comes up as an empty array. Using console.log the only place I am able to see the state.subjects populated is if its in the mutation function. Anywhere else the console.log is empty. It seems to me that the state is not persisting from the
Vue.js component specific delimiters with Django and Vue-loader
I am creating a Django + Vue.js v3 app, and found it very useful to use vue3-sfc-loader, as I can use Django to render .vue files easily, and get the best of both worlds. This setup works and Django successfully renders the .vue file, which are then picked up by vue3-sfc-loader, but the issue is that I cannot change the
What is the proper way to test Vue3 async setup component with suspense?
No doubt that Suspense feature leads to a cleaner code base, but as tidy as it is, it turns to be hard to test. Specifically it is not well documented yet. case: Regular app generated by VUE CLI Tech stack: Vuex, Router, PWA, jest for unit testing Challenge: I made use of Suspense component as recommended as follows: I have
Vue 3 i18n issue: The message format compilation is not supported in this build
vue & vue-i18n version ex: vue: 3.0.0.0 vue-i18n: 9.0.0-beta.15 Description I am probably doing something very wrong, however I would really appreciate some direction. I followed documentation from vue-i18n@next. Translation does not work and I get message in console: [intlify] The message format compilation is not supported in this build. Because message compiler isn’t included. You need to pre-compilation all