vue3使用mixins

<template>
  <div>{
    
    {
    
     num }}___{
    
    {
    
     fav }}</div>
  <button @click="favBtn">改变值</button>
</template>

<script setup lang="ts">
import mixin from "../mixins/mixin";
let {
    
     num, fav, favBtn } = mixin();
defineExpose({
    
     num, fav, favBtn });
</script>

<style></style>

../mixins/mixin.ts:

import {
    
     ref } from "vue";
export default function() {
    
    
    let num = ref(1);
    let fav = ref(false);
    let favBtn = () => {
    
    
        num.value += 1;
        fav.value = true;
        setTimeout(() => {
    
    
            fav.value = false;
        }, 2000)
    }

    return {
    
    
        num,
        fav,
        favBtn
    }
}

效果图：