如何将HTML文本转普通文本传入TextEditingController供TextFormField编辑

之前使用html包在Text Widget展示正常、传入TextEditingController残留HTML标签，核心原因是默认解析逻辑没有处理块级标签换行映射、HTML实体转义、多余空白清理；htmleditorenhanced依赖原生WebView实现，纯文本转换场景下属于重依赖，很容易出现插件缺失、卡顿问题；直接用htmlparser输出格式错误也是同理，没有做对应后处理。以下是经过验证的无坑方案：

• 方案1：修正html包解析逻辑（优先推荐，纯Dart实现无原生依赖，无插件报错，性能最优）
  该方案不需要引入原生插件，不会出现MissingPluginException问题，适配所有Text类组件包括TextFormField，实现代码如下：

// 引入纯Dart实现的html解析依赖，无平台兼容问题
import 'package:html/parser.dart' as html_parser;
import 'package:html/dom.dart';

String convertHtmlToPlainText(String rawHtml) {
  // 预处理：提前将换行类标签替换为实际换行符，避免解析后丢失格式
  String preProcessed = rawHtml
      .replaceAll(RegExp(r'<br\s*/?>', caseSensitive: false), '\n')
      .replaceAll(RegExp(r'</p>', caseSensitive: false), '\n\n')
      .replaceAll(RegExp(r'</div>', caseSensitive: false), '\n')
      .replaceAll(RegExp(r'</h[1-6]>', caseSensitive: false), '\n\n');
  // 移除script、style标签内容，避免无关文本混入
  preProcessed = preProcessed.replaceAll(RegExp(r'<script[\s\S]*?</script>', caseSensitive: false), '');
  preProcessed = preProcessed.replaceAll(RegExp(r'<style[\s\S]*?</style>', caseSensitive: false), '');

  Document htmlDoc = html_parser.parse(preProcessed);
  String plainText = htmlDoc.body?.text ?? '';

  // 后处理：清理转义字符、多余空白
  plainText = plainText
      .replaceAll('\u00a0', ' ') // 处理&nbsp;对应的不间断空格
      .replaceAll(RegExp(r'[ \t]+\n'), '\n') // 清理行首多余空格
      .replaceAll(RegExp(r'\n{3,}'), '\n\n') // 限制连续换行最多2个
      .trim();
  return plainText;
}

转换后的纯文本直接赋值给TextEditingController.text即可，不会残留任何HTML标签。

• 方案2：正则表达式直接转换（零第三方依赖，适合HTML结构简单的场景）
  如果不想引入任何第三方包，可以直接通过正则匹配移除标签、处理转义字符，实现代码如下：

String convertHtmlToPlainTextRegex(String rawHtml) {
  String result = rawHtml;
  // 先移除script、style标签及内容
  result = result.replaceAll(RegExp(r'<script[\s\S]*?</script>', caseSensitive: false), '');
  result = result.replaceAll(RegExp(r'<style[\s\S]*?</style>', caseSensitive: false), '');
  // 替换换行类标签为实际换行
  result = result.replaceAll(RegExp(r'<br\s*/?>', caseSensitive: false), '\n');
  result = result.replaceAll(RegExp(r'</(p|div|h[1-6])>', caseSensitive: false), '\n\n');
  // 移除所有剩余HTML标签
  result = result.replaceAll(RegExp(r'<[^>]*>', multiLine: true, caseSensitive: false), '');
  // 处理常见HTML转义实体
  result = result
      .replaceAll('&nbsp;', ' ')
      .replaceAll('&amp;', '&')
      .replaceAll('&lt;', '<')
      .replaceAll('&gt;', '>')
      .replaceAll('&quot;', '"')
      .replaceAll('&#39;', "'")
      .replaceAll('\u00a0', ' ');
  // 清理多余空白
  result = result.replaceAll(RegExp(r'\n{3,}'), '\n\n').trim();
  return result;
}

注意该方案对结构极复杂、嵌套不规范的HTML解析准确率略低于方案1，普通业务场景足够使用。

注意：纯文本转换场景不要使用依赖原生视图的富文本编辑类插件，这类插件设计目标是所见即所得的富文本编辑，用来做HTML转纯文本属于大材小用，还会引入不必要的平台兼容问题、性能问题。

内容的提问来源于stack exchange，提问作者Deva