Vue Tip: Infer Props From Components in a Component Map
Use a typed entry helper to infer props from each component in a component map. This is useful when rendering dynamic blocks from CMS or configuration data.
Category · 59 articles
Script
Articles in the category Script.
Vue Tip: Use effectScope for Managing and Cleaning Up Reactive Effects
effectScope can be used to group and cleanup multiple reactive effects.
Vue Tip: When You Should Use a Composable
Vue composables are a way to encapsulate logic in a reusable way in Vue 3. They are a great way to share logic between components, but I often see them used in places where they are not needed.
Vue Tip: Mutate Your State Inside of the Provider Using Provide and Inject
When using reactive provide/inject values, it is recommended to keep any mutations to reactive state inside of the provider whenever possible.
Vue Tip: Validate Props in Script Setup With TypeScript
For prop validations inside `<script setup>` with TypeScript you need to define an interface for the props and use the `withDefaults` helper to set default values.
Vue Tip: Don't Use Reactive Object for Template Refs
Template Refs are a way to access elements in the DOM from within a Vue component. As the name suggests, you should use a ref to access the element in the template.
Vue Tip: Trigger Transition Programmatically
You can programmatically trigger a transition via the "key" attribute.
Vue Tip: Check if Component Has Event Listener Attached
Sometimes, you want to apply specific styles to a component only if it has an event listener attached.
Vue Tip: Watch Slot Changes
You can use the MutationObserver API to react to changes in the slot content.
Vue Tip: Best Way to Force Re-Render Vue Component
In certain scenarios, Vue's reactivity approach isn’t sufficient, and we need to force re-rendering of specific components.