像数据分析一样写 Web 页面，这个 Python 库做到了！

　　像数据分析一样写 Web 页面，这个 Python 库做到了！

　　插入文字

　　平时我们写 html 会用类似标签来控制标题，用

　　``这样的标签来输出文字。

　　在 PyWebIO 中可以使用 markdown 来实现类似效果，语法是put_markdown()，将markdown添加进去，就会自动渲染

　　put_markdown(("""#  我的第一个页面<br /><br />    这是早起Python教我用Python写的第一个页面！<br />    <br />    写点什么呢？到底写一点什么好呢？好像真的没什么好写的，到底写什么呢？<br /><br />    我也不知道该写点什么， 反正有点什么内容就好了！"""), lstrip=True)<br />

　　效果如下

　　插入图片

　　静态元素是一个网页的重要组成部分，使用 PyWebIO 插入也是很简单，使用 put_image() 可以插入图片，代码如下

　　put_image(open('iShot2021-10-29 17.14.08.png', 'rb').read()) <br />

　　随手用手机拍了一张图片，效果如下

　　插入表格

　　传统html使用table插入表格，这里使用类似方法

　　    put_table([<br />    ['商品', '价格'],<br />    ['苹果', '5.5'],<br />    ['香蕉', '7'],<br />])<br />

　　效果如下，后面如果表格内容需要变化，可以写个函数让他动态更新

　　插入代码

　　

　　插入代码也是没有问题的

　　展示效果如下

　　交互 - 收集信息

　　上面都是常规的静态元素添加，其他一些库也能做到，甚至手写原生html都行，下面来点更高级的！

　　首先是简单的交互式输入框，开发者已经写好了，调用命令也很简单

　　name = input("你的名字是什么？?")<br />

　　只用一行代码，效果如下，当然这也意味着样式什么的不支持修改

　　这里我们选择将接收到消息打印出来，当然也是可以写一个函数，将数据进行保存，这会在后面带大家开发问卷系统讲到

　　交互 - 隐藏输入

　　如果我们在开发问卷系统，有些选项希望用户输入时可以隐藏输入，就像输入密码一样

　　password = input("不想让别人看见你的输入？", type=PASSWORD)<br />

　　交互 - 输入代码

　　通过交互输入框接收代码也是可以的，后面我讲介绍如何让代码执行，下面是可以实现的样式

　　

　　    code = textarea('Code Edit', code={<br />    'mode': "python",  # code language<br />    'theme': 'darcula',  #  Codemirror theme<br />}, value='import something\n# Write your python code')<br />

　　交互 - 按钮功能

　　其实上面说的存储数据也好，执行代码也好，本质上就是给这个提交按钮添加一个功能，我们来实现最简单的计算器。也就是点击提交，计算两数相加

　　    data = input_group("做个计算器", [<br />        input('第一个数字', name='num1', type=NUMBER),<br />        input('第二个数字', name='num2', type=NUMBER)<br />    ])<br />    put_text(f"计算结果是{data['num1']} + {data['num2']} = {data['num1'] + data['num2']}  ")<br />

　　因为简单，连函数都不用定义，直接 f-string 就解决了，如果需要复杂的功能，就可以定义一个函数，点击按钮就执行这个函数

　　如何渲染页面

　　从上面的介绍不难看出，用 PyWebIO 就好比往一张白纸里面塞东西。

　　但我还没说，如何创建一张白纸以及如何渲染页面，下面是一个本文用的最简单的框架

　　from pywebio import *<br />from pywebio.input import *<br />from pywebio.output import *<br /><br />def myfirstpage():<br /><br />    something<br />    <br />if __name__ == '__main__':<br /><br />    start_server(myfirstpage,port=8082,auto_open_webbrowser=True)<br />

　　可以看到，我们只要定义一个函数，然后往里面塞各种内容，最后通过start_server()指定端口启动就行！

　　03

　　小结

　　至此，有关 PyWebIO 开发页面的基本流程与常见操作就介绍完了。

　　是不是就像数据分析一样，拿着各种函数对数据一通操作，我们也是拿着各种写好的功能，需要一个添加一个！ 如果你感兴趣的话，我强烈建议你自己敲一遍代码感受一下。

　　当然，本文介绍的代码只是最简单的demo，关于这个库我还有很多想说的，最近我用这个库亲自做了一个数据查询页面，如果你喜欢的话，可以给本文点赞支持一下！

　　各位伙伴们好，詹帅本帅搭建了一个个人博客和小程序，汇集各种干货和资源，也方便大家阅读，感兴趣的小伙伴请移步小程序体验一下哦！（欢迎提建议）