How do I get refs and computed vars to show up in Vue Devtools when using the Composition API and the Script Setup syntax?
I have a number of variables in one of my components that would go in the data() function or computed: {} section when using Vue's Options API (which I'm more familiar with), but this component is using the Composition API and the <script setup> syntax, and I'm not seeing the variables show up in Vue Devtools, despite the fact that the props and refs are showing up.
What do I need to do to get these variables to show up in the Vue Devtools?
It turns out that this is a known bug with version 6.4.5 of the Vue Devtools for imported components that use the <script setup> syntax: https://github.com/vuejs/devtools/issues/1940
There is a PR to fix the issue here: https://github.com/vitejs/vite-plugin-vue/pull/81
Until that fix is available, the workaround is to use the defineComponent syntax for those imported components (assuming you can change their code).
- Vue direct URL is not working, only router-link click
- vue-router, nginx and direct link
- How to mock composable with vitest?
- POST http://127.0.0.1:8000/admin/sparepart 404 (Not Found) when i try to Inertia.post('/admin/sparepart', formData)
- Nuxt 3 Supabase - 500 auth Session missing
- Vue.js: Run a method after a delay, but reset the delay if user input happens
- Get element height with Vuejs
- How to add a script block to head in Nuxt 3?
- How do I use /deep/ or >>> or ::v-deep in Vue.js?
- Vue 3: Error on creation "Expected identifier but found 'import'"
- vite failed to load config from vite.config.js,
- How to use components in v-html
- How to get the vue-progressbar to display?
- Vue JS: How to prevent Input updating itself on livedata?
- How to set and change ( title of page ) in inertiajs and vue3
- How to import jQuery into $ in a Vue.js 3 / Vite application
- Redirecting of HTTP request on Vite-Vue app - DEV mode
- Vue | Module has no default export
- Vue.js iterate complex object by data key
- QR Code Generator Not Working as Expected
- Generate PDF with puppeteer without save it
- PrimeVue InputNumber's width exceeds the width of its parent
- CORS - Response to preflight request doesn't pass access control check: It does not have HTTP ok status
- Vue 3 - "Failed to resolve component" with global components
- Emit model updating from keydown event in vue
- How check if Vue is in development mode?
- Black flash issue when toggle the visibility of symbol pin on azure map
- ENOLOCK npm ERR! Error while running npm audit fix
- Detect Back Button in Navigation Guards of Vue-Router
- vue.js when sorting grid only values is updated, not HTML