Flask 实战：28、使用Flask-CKEditor集成富文本编辑器
资源编号:75879
Python Web
Flask Web开发实战：入门、进阶与原理解析
热度：88
富文本编辑器即WYSIWYG（What You See Is What You Get，所见即所得）编辑器，类似于我们经常使用的文本编辑软件。它提供一系列按钮和下拉列表来为文本设置格式，编辑状态的文本样式即最终呈现出来的样式。在Web程序中，这种编辑器也称为HTML富文本编辑器，因为它使用HTML标签来为文本定义样式。
`。Flask-CKEditor通过包装WTForms提供的TextAreaField字段类型实现了一个CKEditorField字段类，我们使用它来构建富文本编辑框字段。代码清单中的RichTextForm表单包含了一个标题字段和一个正文字段。
```
from flask_wtf import FlaskForm
from wtforms import StringField, SubmitField
from wtforms.validators import DataRequired, Length
from flask_ckeditor import CKEditorField # 从flask_ckeditor包导入
class RichTextForm(FlaskForm):
title = StringField('Title', validators=[DataRequired(), Length(1, 50)])
body = CKEditorField('Body', validators=[DataRequired()])
submit = SubmitField('Publish')
```
文章正文字段（body）使用的CKEditorField字段类型从Flask-CKEditor导入。我们可以像其他字段一样定义标签、验证器和默认值。在使用上，这个字段和WTForms内置的其他字段完全相同。比如，在提交表单时，同样使用data属性获取数据。
在模板中，渲染这个body字段的方式和其他字段也完全相同，在示例程序中，我们在模板ckeditor.html渲染了这个表单，如代码清单所示:
```
{% extends 'base.html' %}
{% from 'macros.html' import form_field %}
{% block content %}