textarea换行不丢失需前后端协同：前端用replace(/[ u2028u2029]/g, ' ')归一化换行符并避免.trim()；后端禁用自动trim、检查原始请求体是否含 ；渲染时用textContent+white-space:pre-line或pre-wrap。

textarea 提交时换行符在前后端之间怎么不丢

用户在 textarea 里按 Enter 输入的换行，前端 .value 里确实是 （macOS/Linux）或 （Windows），但一提交就变空格或消失——问题通常不出在表单本身，而在于中间某个环节悄悄“吃掉”了它们。

• 后端收到前，检查原始请求体：Node.js 用 console.log(req.body.message)，PHP 用 var_dump($_POST['message'])，确认字符串里是否真有 字符；没有就别往下调样式
• 框架常默认 trim()，比如 Laravel 的 TrimStrings 中间件、Express 的 body-parser 配置不当，都会删掉首尾控制字符（包括 ）
• 若走 JSON 提交，JSON.stringify() 会保留 ，但某些老旧 PHP 解析器可能把裸 当异常，建议统一转成 \n 字符串再解析（需前后端约定）

前端提交前要不要手动 normalize 换行符

要，而且必须做。不同系统回车产生不同序列，不归一化，后端存进数据库、日志分析、甚至前端再次渲染都可能错乱。

• 前端清理推荐写法：value.replace(/ | | /g, ' ') —— 统一为 LF
• 更稳妥（含 Unicode 换行符）：value.replace(/[ u2028u2029]/g, ' ')
• 别只信前端：后端接收后仍需重复此步骤，不能依赖前端传来的格式
• 注意：replace() 后若用于 innerHTML 渲染，得先 HTML 转义，否则 XSS 风险

服务端存入数据库后，前端显示时换行不生效

不是数据库丢了换行，而是你用了 innerText 或没设对 CSS —— 在 HTML 文本流里本就不渲染为视觉换行。

Html2md

使用 Readability + Turndown 将 HTML 页面转换为干净的、Agent 友好的 Markdown。去除导航栏、广告、页脚、Cookie 横幅、社交按钮等干扰元素。支持 URL...

下载

• 渲染时优先用 textContent + CSS：white-space: pre-line（合并空格、保留换行、自动折行）或 pre-wrap（保留空格和换行）
• 避免用 innerText：它会把 当空白处理，直接抹掉
• 禁用 innerHTML 直接插未转义内容；若必须用，先转义再

  replace(/
  /g, '<br>')

  ，且确保

  <br>

  不被模板引擎二次过滤
• 检查元素是否为块级： 即使设了 white-space: pre-line 也无效，得用
  或

  为什么 Vue/React 里 v-model / value 绑定后换行突然没了

  响应式框架本身不破坏换行，但自定义逻辑容易踩坑：比如防抖指令、格式化函数、或受控组件的 setState 过程中做了 .toString().trim()。

  • Vue 2：v-model 对 textarea 是 .value 代理，一般安全；但自定义指令如 v-format 若在 set 时调用 String(value).trim()，首尾 就没了
  • Vue 3 / React：受控组件要求 value 属性严格等于用户输入，若 state 更新滞后或被中间件截断，React 会强制重置 DOM 值，导致光标跳脱、换行丢失
  • 调试方法：在 input 事件回调里打日志，输出 event.target.value.length 和 event.target.value.split(' ').length，确认是否从源头就被改过

  真实项目里最常被忽略的点是：你以为后端返回的字符串里有 ，其实它早被某层中间件替换成空格或删掉了；或者你写了 white-space: pre-line，但容器是 ，样式压根不生效。先确认数据链路里每个环节的原始值，再谈渲染。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！