Skip to content

Instantly share code, notes, and snippets.

@cn-2k
Created May 3, 2022 12:37
Show Gist options
  • Save cn-2k/b5cd808ea4df6ab93ebc4c25099f9b46 to your computer and use it in GitHub Desktop.
Save cn-2k/b5cd808ea4df6ab93ebc4c25099f9b46 to your computer and use it in GitHub Desktop.
How to re-render an component using Vue 3 w/ Composition API
<template>
<my-component :key="componentKey" />
<button @click="forceRerender">Re-render component</button>
</template>
<script setup>
import { ref } from 'vue'
import myComponent from '@/components/myComponent.vue'
// constant that'll carry our component key to be re-rendered
const componentKey = ref(0)
// method (named function) to force component re-render
const forceRerender = () => {
// incrementing componentKey constant
componentKey.value++
}
// source: https://michaelnthiessen.com/force-re-render/
</script>
<style lang="scss" scoped>
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment