换行

 <template>
   <div class="article-item-intro">
     <div ref="intro" v-if="intro" class="intro" :class="introClass" :style="introStyle" @click="onExpanding">
-      {{intro}}
-      <div ref="introPool" class="intro-pool" v-if="!data.introHeight && isEllipsis">{{data.intro}}</div>
+      <p class="pre-wrap">{{intro}}</p>
+      <div ref="introPool" class="intro-pool pre-wrap" v-if="!data.introHeight && isEllipsis">{{data.intro}}</div>
       <span class="expand" v-if="showExpandTxt">…展开</span>
       <div class="collapse" v-if="showCollapseTxt">收起</div>
     </div>
@@ -211,15 +211,16 @@ export default {
     color: #4a4a4a;
     letter-spacing: 0.06PX;
     overflow: hidden;
-    display: -webkit-box;
-    text-overflow: ellipsis;
-    -webkit-line-clamp: 3;
-    -webkit-box-orient: vertical;
     position: relative;
     line-height: 40px;
-    height: 124px;
     box-sizing: content-box;
-    transition: height 300ms cubic-bezier(0.165, 0.84, 0.44, 1);
+    transition: height 250ms cubic-bezier(0.165, 0.84, 0.44, 1);
+
+    .pre-wrap {
+      white-space: pre-wrap;
+      word-wrap: break-word;
+      display: inline;
+    }
 
     &.intro-will-change {
       will-change: height;