<el-table-column prop="ZAOC" label="早餐" :formatter="tableFunction" width="190"></el-table-column> 中 如何让 tableFunction 返回的值支持html

在 Vue.js 中，如果你想让 `tableFunction` 函数返回的内容支持 HTML，你可以使用模板字符串（Template String）结合 Vue 的特殊语法 `v-html` 来插入 HTML 内容。这里是一个例子：

<template>
  <el-table-column
    prop="ZAOC"
    label="早餐"
    :formatter="tableFunction"
    width="190"
  ></el-table-column>
</template>

<script>
export default {
  methods: {
    tableFunction(item) {
      // 在这里处理并返回包含 HTML 的字符串
      let contentWithHtml = `<strong>${item.ZAOC}</strong>`;
      // 使用 v-html 安全地插入 HTML
      return `<span v-html="${contentWithHtml}"></span>`;
    }
  }
};
</script>

在这个例子中，`tableFunction` 接收一个对象 `item`，然后创建了一个包含 `<strong>` 标签的字符串。返回的时候，我们使用了 `v-html` 来插入这个字符串，并包裹在一个 `<span>` 元素里，这样 Vue 就会在渲染时转换成实际的 DOM 结构。