dz-app/pages/college-library/components/college-item-collect.vue

<template>
    <view class="fx-col fx-cen-cen min-w-90" @click="handleToggle">
        <uv-icon size="19" :name="collected?'heart-fill':'heart'" color="var(--primary-color)"/>
        <text class="text-xs text-primary">{{ collected ? '已收藏' : '收藏' }}</text>
    </view>
</template>

<script setup>
import {computed} from 'vue';
import {createPropDefine} from "@/utils";
import {useCollegeCollectionService} from "@/pages/college-library/components/useCollegeCollectionService";

const props = defineProps({
    college: createPropDefine({}, Object)
})
const emits = defineEmits(['change'])

const collegeRef = computed(() => props.college)
const {collected, handleToggle, onChange} = useCollegeCollectionService(collegeRef)

onChange((collected) => emits('change', collected))
</script>

<style scoped>

</style>