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>
关于 LearnKu
粤公网安备 44030502004330号
推荐文章：