elementui表格table中实现内容的换行

问题

elementui 中的 table 行内的内容不能进行换行。

解决方法

思路：

利用 作用域插槽 结合 v-html，通过作用域插槽传递内容到表格行内，再通过 v-html 进行内容的替换。

代码：

<el-table
  :data="tableData"
  stripe
  style="width: 100%"
  @row-click="handleTableRow"
  border
 >
   <el-table-column prop="project" label="项目" width="290">
      <template slot-scope="scope">
        <div v-html="scope.row.content"></div>
      </template>
	</el-table-column>
</el-table>

<script>
export default {
  data() {
    return {
      tableData: [
		{
          project: "aaa<br/>111"
        },
        {
          project: "bbb<br/>222"
        },
	  ]
    }
  }
}
</script>

👇觉得有帮助的朋友可以支持下作者哦，您的鼓励是我创作的最大动力，如有开发问题可联系作者