每個(gè)使用Django的人都知道Django表單的優(yōu)點(diǎn)。但是，當(dāng)你第一次使用它時(shí)，一般會(huì)出現(xiàn)一個(gè)問(wèn)題：我該如何設(shè)計(jì)它的樣式？如何添加class？

是的，其實(shí)有一種方法（實(shí)際上很簡(jiǎn)單），就是必須使用widgets（小部件）。

?什么是widgets：widgets是Django對(duì)HTML輸入元素的表示。widgets處理HTML的呈現(xiàn)，并從與widgets相對(duì)應(yīng)的GET / POST字典中提取數(shù)據(jù)。

換句話(huà)說(shuō)，widgets只是定義如何將內(nèi)容呈現(xiàn)為HTML的一種方法。因此，例如，CharField具有默認(rèn)的TextInput小部件，該小部件呈現(xiàn)為<input type =“ text”>。

但是小部件是可自定義的，因此還可以設(shè)置諸如文本區(qū)域的大小之類(lèi)的內(nèi)容，或者該字段是否將成為必填字段等等。

因此，讓我們嘗試構(gòu)建一個(gè)示例來(lái)展示實(shí)際使用的小部件。
假設(shè)我們有一個(gè)名為UserInfoForm的表單來(lái)獲取用戶(hù)名以及他的電子郵件。

HTML看起來(lái)像這樣：

目前，此表單使用默認(rèn)的窗口小部件，并且沒(méi)有任何樣式，因此基本上，它看起來(lái)像這樣：

看著還可以，但是它仍然可以改進(jìn)，我們可以向其中添加一個(gè)Bootstrap類(lèi)。我們可以通過(guò)在attrs字典中聲明一個(gè)類(lèi)來(lái)做到這一點(diǎn)。

我們添加了一個(gè)Bootstrap類(lèi)，然后看結(jié)果：

但是通常當(dāng)我們使用Django表單時(shí)，這些表單與某種模型相關(guān)，而現(xiàn)在這種表單卻沒(méi)有。為此，我們需要進(jìn)行一些更改。我們現(xiàn)在將使用小部件類(lèi)。窗口小部件類(lèi)具有基本的屬性attrs，就像上面的示例一樣。我們還必須添加一個(gè)名為Meta的新類(lèi)，并指定與該表單相關(guān)的模型的名稱(chēng)，我們要擁有的字段以及這些字段的小部件。

那么這是怎么回事？我們之前使用的CharField和EmailField是內(nèi)建字段類(lèi)，但是如果要使用widgets類(lèi)，則需要使用內(nèi)建控件，在此示例中，這些控件是TextInput和EmailInput。最終它們將工作相同，但配置會(huì)略有不同。

該表單基本上與以前的表單相同，它沒(méi)有改變其呈現(xiàn)方式或其他任何方式，但現(xiàn)在此表單已連接到User模型，該模型是用于存儲(chǔ)用戶(hù)信息的模型。
HTML看起來(lái)像這樣：

最后結(jié)果：

寫(xiě)在最后：
學(xué)習(xí)如何使用窗口小部件非常有用，因?yàn)楝F(xiàn)在你知道如何使這些表單看起來(lái)更好，并且添加Bootstrap類(lèi)非常簡(jiǎn)單，這很方便。

文章轉(zhuǎn)載：Python運(yùn)維技術(shù)

（版權(quán)歸原作者所有，侵刪）