From a1d7e81859f554f3a53680cc35f0f49bf1f77098 Mon Sep 17 00:00:00 2001
From: wwf <1971391498@qq.com>
Date: 星期四, 14 五月 2026 14:37:02 +0800
Subject: [PATCH] 导入项目
---
src/components/Highlight/src/Highlight.vue | 65 ++++++++++++++++++++++++++++++++
1 files changed, 65 insertions(+), 0 deletions(-)
diff --git a/src/components/Highlight/src/Highlight.vue b/src/components/Highlight/src/Highlight.vue
new file mode 100644
index 0000000..ef923a9
--- /dev/null
+++ b/src/components/Highlight/src/Highlight.vue
@@ -0,0 +1,65 @@
+<script lang="tsx">
+import { defineComponent, PropType, computed, h, unref } from 'vue'
+import { propTypes } from '@/utils/propTypes'
+
+export default defineComponent({
+ name: 'Highlight',
+ props: {
+ tag: propTypes.string.def('span'),
+ keys: {
+ type: Array as PropType<string[]>,
+ default: () => []
+ },
+ color: propTypes.string.def('var(--el-color-primary)')
+ },
+ emits: ['click'],
+ setup(props, { emit, slots }) {
+ const keyNodes = computed(() => {
+ return props.keys.map((key) => {
+ return h(
+ 'span',
+ {
+ onClick: () => {
+ emit('click', key)
+ },
+ style: {
+ color: props.color,
+ cursor: 'pointer'
+ }
+ },
+ key
+ )
+ })
+ })
+
+ const parseText = (text: string) => {
+ props.keys.forEach((key, index) => {
+ const regexp = new RegExp(key, 'g')
+ text = text.replace(regexp, `{{${index}}}`)
+ })
+ return text.split(/{{|}}/)
+ }
+
+ const renderText = () => {
+ if (!slots?.default) return null
+ const node = slots?.default()[0].children
+
+ if (!node) {
+ return slots?.default()[0]
+ }
+
+ const textArray = parseText(node as string)
+ const regexp = /^[0-9]*$/
+ const nodes = textArray.map((t) => {
+ if (regexp.test(t)) {
+ return unref(keyNodes)[t] || t
+ }
+ return t
+ })
+ return h(props.tag, nodes)
+ }
+
+ return () => renderText()
+ }
+})
+</script>
--
Gitblit v1.8.0