在使用 el-table 展示數據時，單元格中的數據有可能存在空格和換行符，若不進行設置，瀏覽器默認會取消空格和換行符，如下所示：
解決方法：
將單元格的樣式 “white-space” 屬性設置為“pre-wrap” 即可解決。在VUE頁面中添加如下樣式設置
1 <template> 2 ... 3 </template> 4 5 <style> 6 .el-table .cell.el-tooltip { 7 white-space: pre-wrap; 8 } 9 </style> 10 11 <script> 12 ... 13 </script>
設置后，刷新頁面。表格展示效果如下圖所示：
補充：
從 IntelliJ IDEA 的提示中，我們可以看到 “white-space” 屬性的值主要有如下幾類：
常見的配置對應的釋義如下所示：
| 配置項 | 釋義 |
| normal | 默認。空白會被瀏覽器忽略。 |
| pre | 空白會被瀏覽器保留。其行為方式類似 HTML 中的<pre> 標簽。 |
| nowrap | 文本不會換行，文本會在在同一行上繼續，直到遇到 <br>標簽為止。 |
| pre-wrap | 保留空白符序列，但是正常地進行換行。 |
| pre-line | 合並空白符序列，但是保留換行符。 |
| inherit | 規定應該從父元素繼承 white-space 屬性的值。 |
補充：
若是數據顯示在 textarea 中，是可以保持原來的數據樣式輸出的，如下所示：
相應的VUE代碼如下所示：
1 <el-form :model="formData"> 2 <el-form-item label="基准庫信息：" :label-width="formLabelWidth"> 3 <el-input type="textarea" v-model="formData.benchmarkDetail" clearable placeholder="請輸入基准庫信息..."></el-input> 4 </el-form-item> 5 <el-form-item label="比對庫信息：" :label-width="formLabelWidth"> 6 <el-input type="textarea" :disabled="true" v-model="formData.targetDetail" clearable placeholder="請輸入比對庫信息..."></el-input> 7 </el-form-item> 8 </el-form>