[vue3] 컴포넌트 강제 렌더링 하기

composition api에서
forceupdate()처럼 컴포넌트를 강제로 렌더링 하는 방법을 찾게 되었다.
vue 컴포넌트는 :key 값을 변경해 주면 페이지가 강제로 렌더링이 된다.

예제

//HTML
<input :data="data" :key="myKey" />

//composition api
export default {
  setup() {
    //...

    const myKey = ref(0)

    watch(resetComponent, () => {
      if(/* need to reset */) {
        myKey.value++
      }
    })

    return { myKey }
  }
}