Version

3.0.4

Reproduction link

https://github.com/meikang123/vue3.0.git

Steps to reproduce

hot update

<template>
  <section class="section">
    <h2>不会刷新页面</h2>
    <button @click="change">点击增加状态值</button>
    <p>改变这个元素内容、保存-状态不会丢失、内容：4567</p>
    <p>状态值：{{ count }}</p>
  </section>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';

export default defineComponent({
  name: 'App',

  setup() {
    const count = ref(0);

    const change = () => {
      count.value  = 1;
    };

    return {
      count,
      change
    };
  }
});
</script>

yarn dev:index

no hot update

import { defineComponent, ref } from 'vue';

export default defineComponent({
  name: 'App',

  setup() {
    const count = ref(0);

    const change = () => {
      count.value  = 1;
    };

    return () => (
      <section class="section">
        <h2>不管组件多深层都会刷新页面</h2>
        <button onClick={change}>点击增加状态值</button>
        <p>改变这个元素内容、保存状态会丢失、内容：121</p>
        <p>状态值：{ count.value }</p>
      </section>
    );
  }
});

yarn dev:main

What is expected?

hot update

What is actually happening?

no hot update

vue devtools 无法审查第二种的数据

Read the link I sent you at https://github.com/vuejs/vue-next/issues/2776#issuecomment-741623315:

• a minimal reproduction, no TS, no vant, no class component, etc
• Write it in English so everybody can understand