hlt_app/components/Collapse/CustomCollapse.vue

<template>
	<view class="custom-collapse">
		<uni-collapse v-model="collapseModel">
			<uni-collapse-item name="item" :title="collapseTitle" thumb="/static/images/components/collapse/title-thumb.png">
				<template v-if="!collapseTitle" v-slot:title>
					<slot name="collapseTitle"></slot>
				</template>
				<view class="content">
					<slot name="collapseContent"></slot>
				</view>
			</uni-collapse-item>
		</uni-collapse>
	</view>
</template>

<script>
	import { defineComponent, ref } from 'vue';
	const props = {
		title: {
			type: String,
			default: ''
		}
	}
	export default defineComponent({
		props,
		options: {
			styleIsolation: 'shared'
		},
		setup(props){
			const collapseModel = ['item']
			const collapseTitle = ref(props.title)
			return {
				collapseModel,
				collapseTitle
			}
		}
		
	})
</script>

<style lang="scss" scoped>
	.custom-collapse {

		::v-deep .uni-collapse-item__title-img {
			width: 12rpx;
		}
		
		::v-deep .uni-collapse-item__title-text{
			font-family: 思源黑体;
			font-size: 32rpx;
			color: #000000;
		}
	}
</style>