laravel8如何集成 wangEditor?

以下是代码:
不知道哪里有问题哦~~

laravel8如何集成 wangEditor?

<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! -->
    <meta name="description" content="">
    <meta name="author" content="">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>Frost Blog</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>

    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/css/wangEditor.min.css">
    <script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/js/wangEditor.min.js"></script>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            var editor = new wangEditor('#editor');

            // 配置图片上传接口,你需要在后端实现这个路由
            editor.config.uploadImgServer = '{{ route('uploadImage') }}';

            // 当编辑器内容变化时,同步到隐藏的textarea
            editor.config.onchange = function(newHtml) {
                document.getElementById('hiddenContent').value = newHtml;
            };

            // 创建编辑器实例
            editor.create();
        });
    </script>

<body>
    <form action="/your-save-route" method="post">
        @csrf
        <!-- 不要忘记CSRF令牌 -->
        <div class="form-group">
            <label for="title">标题</label>
            <input type="text" class="form-control" id="title" name="title" placeholder="请输入标题">
        </div>
        <div class="form-group">
            <label for="editor">内容</label>
            <!-- WangEditor 的容器 -->
            <div id="editor"></div>
            <!-- 隐藏的 textarea 用于表单提交 -->
            <textarea id="hiddenContent" name="content" style="display:none;"></textarea>
        </div>
        <button type="submit" class="btn btn-primary">提交</button>
    </form>
</body>

</html>
《L01 基础入门》
我们将带你从零开发一个项目并部署到线上,本课程教授 Web 开发中专业、实用的技能,如 Git 工作流、Laravel Mix 前端工作流等。
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
翟宇鑫
最佳答案

change var editor = new wangEditor('#editor');
to var editor = new wangEditor('editor');

这种基本一看控制台就知道什么问题了

2周前 评论
Richard852555 (楼主) 2周前
讨论数量: 2
翟宇鑫

change var editor = new wangEditor('#editor');
to var editor = new wangEditor('editor');

这种基本一看控制台就知道什么问题了

2周前 评论
Richard852555 (楼主) 2周前

讨论应以学习和精进为目的。请勿发布不友善或者负能量的内容,与人为善,比聪明更重要!