vue MarkdownIt标签多出了＜p＞标签导致高度变丑

​

效果如下：
​ [点击并拖拽以移动] ​

F12观察后发现多了

标签包裹，所以要解决

标签。

在 markdown-it 中禁用自动包裹 <p> 标签的方法

要让 markdown-it 渲染的 Markdown 内容不自动包裹 <p> 标签，你可以使用以下两种方法：

方法一：配置 html 和 breaks 选项

const md = require('markdown-it')({
  html: true,       // 允许 HTML 标签
  breaks: true,     // 将换行符转换为 <br>
  linkify: true     // 可选，自动将 URL 转换为链接
});

方法二：使用 renderInline 方法

const md = require('markdown-it')();
const result = md.renderInline('你的 Markdown 内容');
// 这将只渲染内联内容，不会添加段落标签

注意事项

1. 使用 renderInline 方法时：

   • 不会处理块级元素（如标题、列表、代码块等）
   • 只适合纯文本或内联标记（如加粗、斜体、链接等）

2. 使用配置方法时：

   • 仍然会处理块级元素
   • 只是对段落处理方式有所不同

选择哪种方法取决于你的具体需求。如果需要完全避免块级元素，renderInline 是更好的选择；如果只是需要更灵活地控制段落，配置方法可能更合适。
​