平板上做网站的软件,上海做网站哪里好,wordpress 文章代码块,建设部网站注册规划师查询这里讲一下#xff0c;如何使用vue控制多行文字展开收起(也叫控制文字展开隐藏)。效果#xff1a;这里设置了控制三行#xff0c;如果超过三行会展示#xff0c;“显示更多” 超出文字显示省略号。点击“显示更多”会展开所有文案#xff0c;按钮变成“收起”(未超出三行的…这里讲一下如何使用vue控制多行文字展开收起(也叫控制文字展开隐藏)。效果这里设置了控制三行如果超过三行会展示“显示更多” 超出文字显示省略号。点击“显示更多”会展开所有文案按钮变成“收起”(未超出三行的时候)(展开)(收起)代码实现{{introduce}}查看更多export default {name: Spread,data() {return {isShowMore: false,isDescStatus: true,introduce: };},props: {mes2: {type: String,default: }},methods: {showmoreDesc(e) {let el e.currentTarget;el.previousElementSibling.classList[!this.isDescStatus ? add : remove](overflow-line);el.classList[this.isDescStatus ? add : remove](more-collapse);el.innerHTML !this.isDescStatus ? 查看更多 : 收起;this.isDescStatus !this.isDescStatus;that.isShowMore true;}},watch: {mes2(val) {this.introduce val;if (this.introduce.length 75) {this.isShowMore true;}}}};.m-content {.overflow-line {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}}.btn-more {color: #fff;float: right;color: #5383E7;position: relative;margin-top: rc(5);padding-right: rc(33);.more-collapse {::after,::before {top: 2px;transform: rotate(180deg);}::before {top: 4px;}}::after,::before {width: 0;height: 0;content: ;position: absolute;right: 0;top: 7px;border: rc(12) solid transparent;}::after {border-top-color: #5383E7;z-index: 1;}::before {border-top-color: #1c2239;z-index: 2;top: 5px;}}使用组件以上就是本文的全部内容希望对大家的学习有所帮助也希望大家多多支持脚本之家。