diff --git a/src/pages/MemoDrawer/index.jsx b/src/pages/MemoDrawer/index.jsx index fd16564d..10e18c27 100644 --- a/src/pages/MemoDrawer/index.jsx +++ b/src/pages/MemoDrawer/index.jsx @@ -10,7 +10,7 @@ import { Drawer, List, Skeleton, Button, Tag, Spin, Tooltip, Select, Divider, Badge, Space, Dropdown, App, DatePicker, - Switch + Switch, Popover } from "antd"; import moment from 'moment'; @@ -251,19 +251,60 @@ const MemoDrawer = () => { * @author Yc * @since 2024/9/23 1:27 */ - const linkify = (text) => { + const linkifyContent = (text) => { + // 正则表达式匹配不同类型的 URL const urlRegex = /(https?:\/\/[^\s]+)/g; + const imageRegex = /\.(jpeg|jpg|gif|png|bmp|webp|svg)$/i; // 匹配图片格式 + const videoRegex = /\.(mp4|webm|ogg|mov)$/i; // 匹配视频格式 return text.split(urlRegex).map((part, index) => { - // 如果匹配到的是 URL,将其转换为 标签 if (part.match(urlRegex)) { + // 检查是否是图片格式 + if (imageRegex.test(part)) { + return ( + + Embedded content + + } + > + {part} + + ); + } + // 检查是否是视频格式 + if (videoRegex.test(part)) { + return ( + + + ); + } + // 对其他链接格式使用 标签 return ( {part} ); } - // 否则,返回普通文本 + // 返回普通文本 return part; }); }; @@ -302,7 +343,7 @@ const MemoDrawer = () => { style={{height: '70vh', border: '1px solid #ccc', borderRadius: '6px', padding: 9, overflow: 'auto'}} >
-                  {linkify(itemObj.content)}
+                  {linkifyContent(itemObj.content)}
                 
, })