<template>
<div>
<ExposeDemo ref="count"></ExposeDemo>
</div>
</template>
<script setup>
import { ref, reactive, watch } from "vue";
import ExposeDemo from "./components/ExposeDemo.vue";
const count = ref(null);
watch(
() => count,
(newValue,historyValue) => {
newValue
historyValue
alert(newValue._rawValue.count);
},
{ deep: true }
);
</script>
<style>
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
<template>
<div></div>
</template>
<script setup>
import {ref,defineExpose} from 'vue'
const count = ref(0)
defineExpose({count})
count
</script>