標簽來控制標題，用``這樣的標簽來輸出文字。在 PyWebIO中可以使用 markdown來實現(xiàn)類似效果，語法是put_markdown()，將markdown添加進去，就會自動渲染put_markdown(("""#  我的第一個頁面

這是早起Python教我用Python寫的第一個頁面！

寫點什么呢？到底寫一點什么好呢？好像真的沒什么好寫的，到底寫什么呢？

我也不知道該寫點什么， 反正有點什么內(nèi)容就好了！"""), lstrip=True)
效果如下

插入圖片

靜態(tài)元素是一個網(wǎng)頁的重要組成部分，使用 PyWebIO插入也是很簡單，使用 put_image()可以插入圖片，代碼如下put_image(open('iShot2021-10-29 17.14.08.png', 'rb').read())
隨手用手機拍了一張圖片，效果如下

插入表格

傳統(tǒng)html使用table插入表格，這里使用類似方法    put_table([
['商品', '價格'],
['蘋果', '5.5'],
['香蕉', '7'],
])
效果如下，后面如果表格內(nèi)容需要變化，可以寫個函數(shù)讓他動態(tài)更新

插入代碼

插入代碼也是沒有問題的

展示效果如下

交互 - 收集信息

上面都是常規(guī)的靜態(tài)元素添加，其他一些庫也能做到，甚至手寫原生html都行，下面來點更高級的！首先是簡單的交互式輸入框，開發(fā)者已經(jīng)寫好了，調(diào)用命令也很簡單name = input("你的名字是什么？?")
只用一行代碼，效果如下，當(dāng)然這也意味著樣式什么的不支持修改

這里我們選擇將接收到消息打印出來，當(dāng)然也是可以寫一個函數(shù)，將數(shù)據(jù)進行保存，這會在后面帶大家開發(fā)問卷系統(tǒng)講到

交互 - 隱藏輸入

如果我們在開發(fā)問卷系統(tǒng)，有些選項希望用戶輸入時可以隱藏輸入，就像輸入密碼一樣password = input("不想讓別人看見你的輸入？", type=PASSWORD)

交互 - 輸入代碼

通過交互輸入框接收代碼也是可以的，后面我講介紹如何讓代碼執(zhí)行，下面是可以實現(xiàn)的樣式    code = textarea('Code Edit', code={
'mode': "python", # code language
'theme': 'darcula', #  Codemirror theme
}, value='import something\n# Write your python code')

交互 - 按鈕功能

其實上面說的存儲數(shù)據(jù)也好，執(zhí)行代碼也好，本質(zhì)上就是給這個提交按鈕添加一個功能，我們來實現(xiàn)最簡單的計算器。也就是點擊提交，計算兩數(shù)相加    data = input_group("做個計算器", [
input('第一個數(shù)字', name='num1', type=NUMBER),
input('第二個數(shù)字', name='num2', type=NUMBER)
])
put_text(f"計算結(jié)果是{data['num1']} {data['num2']} = {data['num1']   data['num2']} ")
因為簡單，連函數(shù)都不用定義，直接 f-string就解決了，如果需要復(fù)雜的功能，就可以定義一個函數(shù)，點擊按鈕就執(zhí)行這個函數(shù)

如何渲染頁面

從上面的介紹不難看出，用 PyWebIO就好比往一張白紙里面塞東西。但我還沒說，如何創(chuàng)建一張白紙以及如何渲染頁面，下面是一個本文用的最簡單的框架from pywebio import *
from pywebio.input import *
from pywebio.output import *

def myfirstpage():

something

if __name__ == '__main__':

start_server(myfirstpage,port=8082,auto_open_webbrowser=True)
可以看到，我們只要定義一個函數(shù)，然后往里面塞各種內(nèi)容，最后通過start_server()指定端口啟動就行！

03

小結(jié)

至此，有關(guān)  PyWebIO開發(fā)頁面的基本流程與常見操作就介紹完了。是不是就像數(shù)據(jù)分析一樣，拿著各種函數(shù)對數(shù)據(jù)一通操作，我們也是拿著各種寫好的功能，需要一個添加一個！ 如果你感興趣的話，我強烈建議你自己敲一遍代碼感受一下。