Question

我正在使用Yesod构建一个网站，其中包含每个页面顶部的搜索表单。从我理解到现在，我应该为表单创建一个小部件，但我无法将其包含在一个公共位置。建议的方法是什么？

如果我创建自定义窗口小部件，建议使用的文件夹结构是什么？

Answer 1

这是defaultLayout功能的用途：您可以向此页面添加任何类型的内容，并且您网站的所有使用defaultLayout的网页都会自动继承。

Answer 2

我最近试图在每个具有“登录”链接的页面添加标题（如果用户未经过身份验证），并且如果是“注销”链接。我没有在文档中找到任何好的例子，所以我把它放在一起。

注意：这假设您正在使用脚手架，但即使您不是，您仍然可以使用脚手架。

您需要做的第一件事是创建一个标题小部件，并将其添加到defaultLayout中的Foundation.hs。

pageHeaderWidget :: Handler Widget
pageHeaderWidget = do
  mauthId <- maybeAuthId
  return $(widgetFile "header")

defaultLayout widget = do
  pageHeader <- pageHeaderWidget >>= widgetToPageContent
  -- ...
  withUrlRenderer $(hamletFile "template/default-layout-wrapper.hamlet")

然后你需要为你的标题创建相应的html和样式：

档案：header.hamlet

<header>
    $maybe authId <- mauthId
        Welcome #{show aid} - <a href=@{AuthR LogoutR}> Logout
    $nothing
        <a href=@{AuthR LoginR}> Login

档案：header.lucius

header {
    background-color: #007fff;
    height: 50px;
}

最后，您需要修改default-layout-wrapper.hamlet并添加

^{pageHead pageHeader}

到<head>下面的^{pageHead pc}标记（由脚手架生成）;并替换

<header>

<{1>}中的

<body>

在Yesod的所有页面上添加自定义小部件

2 个答案: