Summernote 所见即所得编辑器无法使用 Laravel 5.8 正确呈现数据

Posted 2023-03-22

【中文标题】Summernote 所见即所得编辑器无法使用 Laravel 5.8 正确呈现数据

【英文标题】：Summernote WYSIWYG editor not rendering data correctly with Laravel 5.8

【发布时间】：2019-11-19 05:26:46

【问题描述】：

当我想从数据库中渲染数据和图像时遇到问题，我正在使用 Summernote 和 Laravel，我将粘贴控制器和视图的代码，提前致谢。

我在他的所有选项中都能正确显示夏季笔记，但是当我尝试在我的文本中添加一些东西时，比如加粗或类似的东西，他没有工作。

控制器：

public function createPost(Request $request)
        $this->validate($request, [

            'title' => 'required',

            'description' => 'required',

        ]);

        $title = $request->input('title');

        $description = $request->input('description');

        $writer = Auth::user()->id;

        $dom = new \DomDocument();

        $dom->loadhtml($description, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);    

        $images = $dom->getElementsByTagName('img');

        foreach($images as $k => $img)

            $data = $img->getAttribute('src');
            list($type, $data) = explode(';', $data);
            list(, $data)      = explode(',', $data);
            $data = base64_decode($data);
            $image_name= "/upload/" . time().$k.'.png';
            $path = public_path() . $image_name;
            file_put_contents($path, $data);
            $img->removeAttribute('src');
            $img->setAttribute('src', $image_name);

        

        $description = $dom->saveHTML();

        $post = new Post;
        $post->title= $title;
        $post->description = $description;
        $post->writer = $writer;
        $post->save();

        return redirect()->route('home')->with('success', 'Post has been successfully added!'); 

添加视图：

        @if(Auth::check())
        <div class="col-md-12">
            <form method="post" action=" route('post.form') ">
                 csrf_field() 
                <div class="form-group">
                    <label for="name">Title</label>
                    <input type="text" class="form-control" id="id_title" name="title"
                           aria-describedby="title" placeholder="Enter title">
                </div>
                <div class="form-group">
                    <label for="description">Description</label>
                    <textarea class="form-control" id="content" rows="3" name="description" placeholder="Description"></textarea>
                </div>
                <button type="submit" class="btn btn-primary">Publish <i class="fas fa-paper-plane"></i></button>
            </form>
        </div>
        @endif

夏日的呼唤：

<script>
    $(document).ready(function() 
        $('#content').summernote(
            height:300,
        );

    );
</script>

结果示例，标题加内容：

【参考方案1】：

查看浏览器的输出，可能是summernote插件调用不正确，

在 head 标签中，检查 javascript 插件和 css。放置它们是正确的顺序。

【讨论】：

你好兄弟，谢谢你的回复我想我对他们的称呼很好：

您可以在浏览器中进行检查吗？看看有没有错误？当您在视图中显示值或使用插件时，您的测试输出在视图中？如果它在您想要显示结果的视图中，请使用 !! $description !!

谢谢你，我把这个变量称为 !! $post->description !! 及其工作，再次感谢您

【参考方案2】：

您应该使用!! $description !! 打印为html。