在el-input type="textarea"上使用v-html 样式丢失?

后端返回的数据里包含标签,需要解析标签后进行展示。因为展示实在多行文本框里展示直接使用v-html，多行文本框样式也丢失了。

想到在插槽中展示,没找到el-input type="textarea"的插槽.

阅读 4.7k

这个问题似乎是在尝试使用 Vue.js 和 Element UI 库来解析和展示包含 HTML 标签的数据。如果在 el-input 组件上直接使用 v-html，样式可能会丢失，因为 v-html 只会解析 HTML，但不会应用任何样式。

如果你需要在多行文本框中展示带有 HTML 标签的数据，并且希望应用样式，你可能需要使用一个库，如 "vue-monaco-editor"，它提供了一个更强大的文本编辑器组件，可以解析 HTML 并应用样式。

这是一个基本的示例，假设你已经安装了 vue-monaco-editor：

<template>
  <div>
    <monaco-editor 
      v-model="value" 
      :options="options" 
      :language="language" 
      ref="monaco"
    ></monaco-editor>
  </div>
</template>

<script>
import { MonacoEditor } from 'vue-monaco-editor'
import 'monaco-editor/min/vs/editor/editor.main.css'

export default {
  components: {
    MonacoEditor,
  },
  data() {
    return {
      value: '',
      options: {
        // Customize options here
      },
      language: 'html', // Set the language to HTML
    }
  },
  mounted() {
    // Fetch your data from the server and set it to `value` when it's available.
  },
}
</script>

在这个例子中，v-model="value" 绑定了编辑器的值，你可以从服务器获取数据并设置到 value 中。options 可以用来定制编辑器的行为和样式，而 language 设置编辑器的语言为 HTML。当你在编辑器中输入或粘贴带有 HTML 的文本时，它将解析和样式化这些标签。

在el-input type="textarea"上使用v-html 样式丢失?

你尚未登录，登录后可以

vue项目如何在初始化之前跳转外部页面？

js如何控制移动端overflow:scroll容器滑动的最大速度？

vue2.6，打包后app.js，8M,chunk.js，6M，加载打开页面很慢，有什么办法减少，打开页面快一些？

Element Plus表格组件如何呈现复杂布局如图？

多个vue项目，后台接口都是一样的，每个vue项目的同一个页面都只是一小部分修改，怎样把公共的代码提出来复用？

如何实现从一个div中拖拽dom到另一个div容器？

electron如何屏蔽鼠标上的前进后退快捷键？