用flask开发个人博客(37)—— 使用Flask-pagedown实现博客文章预览的功能

一、引言

        本文主要讨论的内容,是将我们写的纯文本的博客文章,使用Flask-pagedown模块,将文本转换成html富文本数据,并在浏览器上显示,类似于博客文章的预览功能。PageDown是用JavaScript实现的由文本到Html的转换程序,而Flask-pagedown是对PageDown的一个封装,把其集成到了Flask-WTF表单中。

二、Flask-PageDown的引入和初始化

        在flask的工厂函数中,我们引入并flask程序初始化Flask-pagedown,这样我们可以直接在模板文件中使用有Flask-pagedown定义的变量:
from flask_pagedown import PageDown
......
pagedown=PageDown()
  
def create_app(config_name):  
    app=Flask(__name__)  
    ......
    pagedown.init_app(app)
    ......

三、创建博客表单

        使用Flask-PageDown的自动转换html功能,我们需要将博客的内容字段定义成Flask-PageDown的PageDownFiled,这样我们在渲染的html文件中就可以使用之前创建的pagedown对象,调用其include_pagedown()方法,自动在PageDownFiled渲染区域的下方显示预览的博客文章的内容。
        定义的表单类如下:
from flask_pagedown.fields import PageDownField

class PostForm(FlaskForm):
    body=PageDownField("Your post",validators=[DataRequired()])
    submit=SubmitField('Submit')
        在html模板文件中进行表单对象的渲染,以及添加预览功能:
<form method="POST">  
    {{form.hidden_tag()}}  
    <p>{{form.body.label}}</p>
    {{form.body()}}  
    {{ form.submit()}}
    {{ pagedown.include_pagedown() }}
</form>  
	
        实现的效果如下:



Github位置:
https://github.com/HymanLiuTS/flaskTs
克隆本项目:
Git  clone  Git @github.com:HymanLiuTS/flaskTs.Git
获取本文源代码:
Git checkout FL37



  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值