forms - 向 Yesod 表单添加样式

Question

我正在尝试使用 Yesod 的身份验证插件:yesod-auth-account。它提供了一个默认的表单来使用，我希望向它添加一些 Bootstrap/模板特定的样式。如果我使用自定义表单，我将必须重写很多方法。

这尤其紧迫，因为我想在不同的显示上下文中重用该表单(在导航栏中、注册表单旁边等)。

有什么想法吗？

Answer 1

您可以包装默认电子邮件AuthPlugin:

authEmailCustom :: YesodAuthEmail m => AuthPlugin m
authEmailCustom =
    AuthPlugin "email" (apDispatch authEmail) $ \tm ->
        [whamlet|
<form method="post" action="@{tm loginR}">
    <input type="email" name="email">
    <input type="password" name="password">
    <input type="submit" value="submit">
    <a href="@{tm registerR}">I don't have an account
|]

只需替换您的样式形式即可。然后使用它代替默认的:

instance YesodAuth App where
    ...
    authPlugins _ = [authEmailCustom]

希望这有帮助。