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
111"
}, { project: "bbb
222"
}, ] } } } </script>

你可能感兴趣的:(elementui,前端,vue,elementui,前端,javascript)