el-table中数据根据字符来换行

在 `el-table` 中，可以通过定义 `formatter` 函数来自定义表格中的数据展示方式。如果想要根据字符来实现自动换行，可以通过使用 CSS 的 `word-break` 属性来实现。

具体实现步骤如下：

1. 在 `el-table-column` 中定义 `formatter` 函数，该函数接收两个参数：`row` 表示该行数据，`column` 表示该列属性。例如：

<el-table-column label="内容" prop="content">
  <template slot-scope="scope">
    {{ scope.row.content }}
  </template>
  <template slot="header">
    <span>内容</span>
  </template>
  <template slot-scope="{ row }">
    <div class="table-content">{{ row.content }}</div>
  </template>
</el-table-column>

2. 在 `formatter` 函数中返回需要展示的 HTML 内容，可以在返回的内容中使用 `<span>` 或 `<div>` 等标签来包裹需要换行的字符，并设置 `word-break: break-all` 样式。例如：

<el-table-column label="内容" prop="content">
  <template slot-scope="scope">
    {{ scope.row.content }}
  </template>
  <template slot="header">
    <span>内容</span>
  </template>
  <template slot-scope="{ row }">
    <div class="table-content" v-html="breakWords(row.content)"></div>
  </template>
</el-table-column>

...

methods: {
  breakWords(str) {
    return '<span style="word-break: break-all;">' + str.replace(/(\r\n|\n|\r)/gm, '<br>') + '</span>';
  }
}

在上面的例子中，`breakWords` 方法将字符串中的换行符替换为 `<br>` 标签，同时将 `<span>` 标签包裹在字符串周围，并设置 `word-break: break-all` 样式来实现自动换行。