详解在YII2框架中使用UEditor编辑器发布文章


Posted in PHP onNovember 02, 2018

本文介绍了详解在YII2框架中使用UEditor编辑器发布文章 ,分享给大家,具体如下:

创建文章数据表

 文章数据表主要有4个字段
1.id  主键(int)
2.title 标题(varchar)
3.content 内容(text)
4.created_time 创建时间(int)

创建文章模型

创建文章模型,不要忘记设置验证规则和字段的名称

namespace backend\models;
class Article extends \yii\db\ActiveRecord
{
public function rules()
{
  return [
    [['title', 'content'], 'required'],
  ];
}
public function attributeLabels()
{
  return [
    'id' => 'ID',
    'title' => '名称',
    'content' => '内容',
  ];
}
}

创建控制器

创建文章控制器并编写发布文章功能

namespace backend\controllers;

use backend\models\Article;

class ArticleController extends \yii\web\Controller
{
  /*
   * 发布文章
   */
  public function actionAdd()
  {
    $article = new Article();
    if($article->load(\Yii::$app->request->post()) && $article->validate()){
 $article->created_time = time();
      $article->save();  
      \Yii::$app->session->setFlash('success','文章添加成功');
      return $this->refresh();
    }

    return $this->render('add',['article'=>$article]);
  }
}

安装UEditor小部件

使用composer命令安装

composer require kucha/ueditor "*"

在控制器中定义处理上传文件的动作

在控制器中定义动作,用于处理UEditor上传的文件。

可以配置域名,上传路径,上传文件命名格式等等

public function actions()
{
  return [
    'upload' => [
      'class' => 'kucha\ueditor\UEditorAction',
      'config' => [
        "imageUrlPrefix" => "",//图片访问路径前缀
        "imagePathFormat" => "/upload/image/{yyyy}{mm}{dd}/{time}{rand:6}" //上传保存路径
        "imageRoot" => Yii::getAlias("@webroot"),
      ],
    ]
  ];
}

在视图中显示UEditor编辑器

在视图表单中使用如下代码显示UEditor编辑器

$form = \yii\bootstrap\ActiveForm::begin();
echo $form->field($article,'title');
echo $form->field($article,'content')->widget('kucha\ueditor\UEditor',[
  'clientOptions' => [
    //编辑区域大小
    'initialFrameHeight' => '200',
    //设置语言
    'lang' =>'en', //中文为 zh-cn
    //定制菜单
    'toolbars' => [
      [
        'fullscreen', 'source', 'undo', 'redo', '|',
        'fontsize',
        'bold', 'italic', 'underline', 'fontborder', 'strikethrough', 'removeformat',
        'formatmatch', 'autotypeset', 'blockquote', 'pasteplain', '|',
        'forecolor', 'backcolor', '|',
        'lineheight', '|',
        'indent', '|'
      ],
    ]
]);
echo \yii\bootstrap\Html::submitButton('提交',['class'=>'btn btn-info']);
\yii\bootstrap\ActiveForm::end();

最终页面效果

详解在YII2框架中使用UEditor编辑器发布文章

以下是发布文章功能编写完成后的效果,是不是很炫?希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

PHP 相关文章推荐
Content-type 的说明
Oct 09 PHP
PHP+MYSQL开发工具及资源收藏
Jan 02 PHP
PHP 开源AJAX框架14种
Aug 24 PHP
apache+php+mysql安装配置方法小结
Aug 01 PHP
PHP目录函数实现创建、读取目录教程实例
Jan 13 PHP
php生成EAN_13标准条形码实例
Nov 13 PHP
php判断正常访问和外部访问的示例
Feb 10 PHP
PHP查找数值数组中不重复最大和最小的10个数的方法
Apr 20 PHP
PHP数组实例详解
Jun 26 PHP
php简单压缩css样式示例
Sep 22 PHP
php实现通过soap调用.Net的WebService asmx文件
Feb 27 PHP
PHP数组式访问接口ArrayAccess用法分析
Dec 28 PHP
yii2 上传图片的示例代码
Nov 02 #PHP
yii2实现Ueditor百度编辑器的示例代码
Nov 02 #PHP
php 调用百度sms来发送短信的实现示例
Nov 02 #PHP
Linux下 php7安装redis的方法
Nov 01 #PHP
PHP结合Ffmpeg快速搭建流媒体服务的实践记录
Oct 31 #PHP
php图片裁剪函数
Oct 31 #PHP
php+js实现裁剪任意形状图片
Oct 31 #PHP
You might like
初品cakephp 入门基础
2012/02/16 PHP
php简单实现无限分类树形列表的方法
2015/03/27 PHP
PHP Mysqli 常用代码集合
2016/11/12 PHP
PHP生成图片缩略图类示例
2017/01/12 PHP
Yii2-GridView 中让关联字段带搜索和排序功能示例
2017/01/21 PHP
/etc/php-fpm.d/www.conf 配置注意事项
2017/02/04 PHP
ThinkPHP5与单元测试PHPUnit使用详解
2020/02/23 PHP
JavaScript 编写匿名函数的几种方法
2010/02/21 Javascript
jquery validate使用攻略 第四步
2010/07/01 Javascript
IE6弹出“已终止操作”的解决办法
2010/11/27 Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
2014/06/15 Javascript
jQuery中:has选择器用法实例
2014/12/30 Javascript
jQuery中innerWidth()方法用法实例
2015/01/19 Javascript
Javascript 高性能之递归,迭代,查表法详解及实例
2017/01/08 Javascript
JS对象是否拥有某属性如何判断
2017/02/03 Javascript
js实现上下左右弹框划出效果
2017/03/08 Javascript
基于bootstrap实现bootstrap中文网巨幕效果
2017/05/02 Javascript
javascript观察者模式实现自动刷新效果
2017/09/05 Javascript
微信小程序下拉刷新界面的实现
2017/09/28 Javascript
JS中数据结构之栈
2019/01/01 Javascript
Jquery动态列功能完整实例
2019/08/30 jQuery
vue实现树形结构样式和功能的实例代码
2019/10/15 Javascript
JavaScript canvas绘制圆弧与圆形
2020/02/18 Javascript
python 多进程通信模块的简单实现
2014/02/20 Python
Go语言基于Socket编写服务器端与客户端通信的实例
2016/02/19 Python
python中print的不换行即时输出的快速解决方法
2016/07/20 Python
Python类的动态修改的实例方法
2017/03/24 Python
python爬虫之自制英汉字典
2019/06/24 Python
python 初始化一个定长的数组实例
2019/12/02 Python
python GUI库图形界面开发之PyQt5 MDI(多文档窗口)QMidArea详细使用方法与实例
2020/03/05 Python
面向对象概念面试题(.NET)
2016/11/04 面试题
大学生求职中的自我评价
2013/10/01 职场文书
自荐信格式写作方法有哪些呢
2013/11/20 职场文书
外语学院毕业生的自我鉴定
2013/11/28 职场文书
Vue ECharts实现机舱座位选择展示功能
2022/05/15 Vue.js
MySql如何将查询的出来的字段进行转换
2022/06/14 MySQL