目的:网页端可以使用类似于Word编写文本
工具:umeditor压缩包(可能缺少umeditor.min.js自己下载)
关键:针对text类型的字段category-content(数据表-字段)
content字段是text类型
在引入文件时,可以通过浏览器控制台查看文件是否引入
过程:
1、压缩包解压到/backend/web/css下,之后在backend/asset/AppAsset文件中添加函数
public static function addScript($view,$jsfile){
$view->registerJsFile($jsfile,[AppAsset::className(),'depends'=>'backend\assets\AppAsset']);
}
public static function addCss($view,$cssfile){
$view->registerCssFile($cssfile,[AppAsset::className(),'depends'=>'backend\assets\AppAsset']);
}
2、在_form.php中引入
use backend\assets\AppAsset;
AppAsset::register($this);
AppAsset::addCss($this,"/yii Frame/advanced/backend/web/css/umeditor/themes/default/_css/umeditor.css");
AppAsset::addScript($this,"/yii Frame/advanced/backend/web/css/umeditor/third-party/template.min.js");
AppAsset::addScript($this,"/yii Frame/advanced/backend/web/css/umeditor/umeditor.config.js");
AppAsset::addScript($this,"/yii Frame/advanced/backend/web/css/umeditor/umeditor.min.js");
AppAsset::addScript($this,"/yii Frame/advanced/backend/web/css/umeditor/lang/zh-cn/zh-cn.js");
或者通过静态添加的方式
'css/umeditor/themes/default/_css/umeditor.css',
'css/umeditor/third-party/jquery.min.js',
'css/umeditor/third-party/template.min.js',
'css/umeditor/umeditor.config.js',
'css/umeditor/lang/zh-cn/zh-cn.js',
3、在底部注册
<?php $this->beginBlock("js-block") ?>
$(function () {
var um = UM.getEditor("category-content", {
});
});
<?php $this->endBlock() ?>
<?php $this->registerJs($this->blocks["js-block"], \yii\web\View::POS_END); ?>