网站基础知识,软件工程是干什么的,新网做网站流程,seo论坛需求背景#xff1a;需要实现文本的展开收起效果#xff0c;文本是一行一行的#xff0c;数据格式是数组结构。 如图所示#xff08;图片已脱敏#xff09; 简单实现#xff1a;使用一个变量控制展开收起效果。
展开收起逻辑部分#xff08;react#xff09; const [… 需求背景需要实现文本的展开收起效果文本是一行一行的数据格式是数组结构。 如图所示图片已脱敏 简单实现使用一个变量控制展开收起效果。
展开收起逻辑部分react const [fold, setFold] useState(false);/** 展开收起 */const handleFold () {setFold(!fold);}jsx 部分 Descriptions.Item label证书备用名称{// 展开时展示全部数组内容收起时只展示前5项(fold ? sansData : sansData.slice(0, 5)).map((item, index) {return (div key{index}{item}/div)})}// 控制文本展示{sansData.length 5 div style{{ color: #1890ff, cursor: pointer }} onClick{handleFold}{fold ? spanUpOutlined /收起/span : ... 查看全部}/div}/
/Descriptions.Item
