思路:
主要是css上可以分為兩部分,第一部分展示前面兩行,第二部分會根據第一部分的行數判斷縮排的大小,然後展示第三行。最後通過背景色的控制讓兩者看上去是一段文字。
html
}
}
css
.total-introduce
}.unfold
}}.detailed-introduce
&::after,
&::before
&::before
&::after
.unfold }}
}
js
export default
}, methods:
}, watch:
const descheight = window.getcomputedstyle(this.$refs.desc).height.replace('px', '');
if (parseint(descheight) * 2 > 120) else
});}}
React 長文字展開收起功能實現
設定state變數 state state變數觸發方法 handleup this state this setstate 是否觸發expand fold元件 文字長度大於100則觸發 let i panddiv if text.length 100 expand a else fold a els...
文字的展開與收起
pay hint content class ellipsis?ellipsis unellipsis 1.支付成功後,將會推送排隊號 就診當日可直接前往診室等待叫號就診,無需再現場繳費 排隊。n2.已完成支付 費用的使用者,如在就診前一日取消預約訂單,成功申請取消訂單後,正常情況下系統將會在7個工...
評論 展開 收起
列表中文字最多三行,超出部分省略,並顯示展開收起按鈕,如果文字沒有超出三行則不顯示展開收起按鈕 1 在div 中新增乙個span 然後給div設定超出三行省略,這時候就可以獲取到文字高度和div高度了 2 根據字串長度判斷是否做展開 收起 單行 雙行顯示處理 特點 簡單粗暴 缺點 對於有換行字元的,...