Thinkphp6 使用百度富文本ueditor 代码块pre编辑不显示问题

星陨丶作者头像
星陨丶 2025-05-08

1、问题

tp框架使用ueditor 富文本时,存在代码后台编辑时,代码块pre内容不显示或显示不完整。


2、定位

1)确认导入的ueditor css js是否正常加载和实例化【一般正常显示富文本就可】

2)确认除了代码块pre显示异常外,是否有其他问题【一般有文字不在代码块pre,正常显示就可】

3)那么就可以确定是tp写法问题【如 我使用的是 tp6】


3、解决办法

1)后台编辑页面渲染参数写法

<div class="layui-form-item layui-form-text">
    <label class="layui-form-label">内容</label>
    <div class="layui-input-block">
        <textarea class="layui-textarea" id="content_editor" name="content">{$result_data.content}</textarea>
    </div>
</div>

注意 

{$result_data.content}

为我的内容字段,这里不要 加 | raw,

若是 

{$result_data.content|raw}

会导致代码块pre内容不显示或显示不完整。


2)前台展示详情页[可以忽略]

按照正常写法就可,如加|raw

{$result_data.content|raw}