sidebar 相关问题

MacOS SwiftUI 打开侧边栏的奇怪行为

从图像中可以看出，打开侧面菜单时似乎出现了奇怪的行为。 你能告诉我如何解决这个问题吗？ 内容视图 导入 SwiftUI 结构ContentView：视图{ var bo...

Sphinx 不会为标题生成侧边栏目录

我正在努力处理 Sphinx 生成的文档中的侧边栏目录。 我只想在文档的左侧有一种自动生成的索引树。相反，我看到

Sphinx 侧边栏目录：包括部分标题

我在 Sphinx 中使用 Alabaster 主题。 侧边栏设置为显示本地目录和其他一些内容。 来自conf.py： html_sidebars = { '**'：[ 'localtoc.html', '

修复二十一中的侧边栏重叠问题

我正在基于二十一十一在我的子主题中制作一个带有侧边栏的新页面模板。 由于在twentyeleven的function.php中，它无法正确显示： 函数twentyeleven_body_classes($

如何不定位侧边栏

我添加了 CSS 以在帖子中添加超链接下划线的特定样式。我设法让它工作，这样 CSS 就不会影响页眉或页脚。然而，它确实影响了我侧边栏中的链接，wh...

为什么我的自定义tkinter框架的宽度不起作用？

好吧，我正在尝试使用customtkinter制作侧边栏，但我无法设置框架的宽度。我在 __init__ 函数中定义的所有其他属性都有效，但宽度和高度无效。 我的

Bootstrap 5 切换侧边栏菜单

如何让Bootstrap 5在桌面视图上显示侧边栏？ 关联 添加了按钮和此代码但没有运气 $("#menu-toggle").click(function (e) { e.preventDefault(); $("#wrapper").

如何在Wordpress仪表板上展开侧边栏

我不小心（不知道如何）折叠了我的 WordPress 仪表板上的侧边栏，所以现在我只能看到图标而不是“媒体”、“插件”等。我无法让它重新展开，并且

为什么侧边栏的按钮无法点击？

侧边栏上的按钮不可点击。在我的主页上，按钮元素工作清晰，但在侧边栏上，它不起作用。 从“react”导入{useContext，TouchableOpacity}； 重要...

为什么侧边栏按钮无法点击？

侧边栏上的按钮不可点击。在我的主页上，按钮元素工作清晰，但在侧边栏上，它不起作用。 从“react”导入{useContext，TouchableOpacity}； 导入 { DataCo...

粘性且可滚动的侧边栏 - CSS 和 HTML

我正在 Shopify 商店工作，但我想让这个侧边栏具有粘性和可滚动性。可滚动的原因是使用position:sticky;时侧边栏的 css 标注看起来...

如何使展开的部分与其他部分达到相同的高度？

我正在尝试制作一个带有扩展项目列表的 html css 页面。我需要扩展部分也与 Figma 设计图像具有相同的垂直位置 身体 { 玛...

coreui - 如何在侧边栏的页脚 (CSidebarFooter) 正确创建注销链接（带图标）？ （在 React 中）折叠/展开问题

在React的coreui中，如何在侧边栏的页脚正确创建注销链接（带图标）？ （在 React 中）我希望当侧边栏展开时，它应该有图标和文本。当 b 面时...

为侧边栏导航进行简单的 Turbostream 更新而苦苦挣扎

涡轮触发链接只是刷新我的用户显示视图的页面。 我尝试了turbo_stream.replace和turbo_stream.update也指向框架rightmaincontent，但发生的只是

PrimeNG 侧边栏可清除 primeng 消息。为什么？

在我的 app.component.html 中我有 ... 在我的 app.component.html 中我有 <div class="main"> <button type="button" (click)="onShowNotificationSideBar()" label="Show"></button> <p-sidebar [(visible)]="notificationSideBarVisible" position="right" [style]="{width:'50em'}"> <button type="button" pButton pRipple (click)="showSuccess()" label="S" class="p-button-success"></button> <button type="button" pButton pRipple (click)="showWarn()" label="W" class="p-button-warning"></button> <button type="button" pButton pRipple (click)="showError()" label="E" class="p-button-danger"></button> <h3>Messages</h3> <h5>{{messages}}</h5> <p-messages [(value)]="messages" [enableService]="false" ></p-messages> </p-sidebar> <p-toast position="center"></p-toast> <router-outlet></router-outlet> </div> 在 app.component.ts 中我有 import { Component } from '@angular/core'; import { Message, MessageService } from 'primeng/api'; @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'], providers: [MessageService] }) export class AppComponent { title = 'WECO'; notificationSideBarVisible = false; constructor(private messageService: MessageService) { messageService.messageObserver.subscribe((m:Message | Message[])=>{ if (!Array.isArray(m)){ this.messages.push(m) } this.messages = [...this.messages]; }); } onShowNotificationSideBar(){ this.notificationSideBarVisible=true; } count=0; messages : Message[] = [ // { severity: 'success', summary: 'Success', detail: 'Message Content' }, // { severity: 'info', summary: 'Info', detail: 'Message Content' }, // { severity: 'warn', summary: 'Warning', detail: 'Message Content' }, // { severity: 'error', summary: 'Error', detail: 'Message Content' } ]; longSentence = 'Let’s end all this nonsense about how long sentences = run-on sentences. You can have a six-word run-on sentence (“I went shopping I ate donuts.”), while most of the sentences below are much, much longer than that and are not run-ons';//'And let’s end all this nonsense about how long sentences = run-on sentences. You can have a six-word run-on sentence (“I went shopping I ate donuts.”), while most of the sentences below are much, much longer than that and are not run-ons (except for a few examples like Jose Saramago). But whether the sentence is grammatically correct isn’t nearly as important as whether the sentence is fun or beautiful.' showWarn(){ let detail='User Deleted a Weco Rule'; if (this.count++%5===0) detail = this.longSentence; this.messageService.add({severity:'warn', summary:'User Action', detail: detail}); } showSuccess(){ let detail = 'Weco Rule 123 Saved'; if (this.count++%5===0) detail = this.longSentence; this.messageService.add({severity:'success', summary:'Service Call', detail:detail}); } showError(){ let detail = 'api-call:get-factories returned 404'; if (this.count++%5===0) detail = this.longSentence; this.messageService.add({severity:'error', summary:'Service Call', detail:detail}); } } 如果我打开侧边栏并在其中添加一些消息，它们就会出现，但是当我关闭并重新打开时，它们就会消失。 即使我可以看到 messages 变量仍然有它们。为什么？ 附： 如果我添加更多消息，我只会看到新消息。 侧边栏菜单有一个名为 p-messages 的组件，如果您检查该元素，您会发现关闭时 p-sidebar 的内容会被破坏。 当您重新打开侧边栏时，数据保持不变，但消息会被破坏。 我认为 p-messages 组件只会显示数组引用发生变化，这可能是由于组件内部的 *ngFor 带有 trackBy，所以我们需要重置内存中的每个数组元素引用，以便我们欺骗 p-messages 认为列表中有新消息，为此我们可以使用对象解构！我会在侧边栏打开时执行此操作(onShowNotificationSideBar) onShowNotificationSideBar() { this.notificationSideBarVisible = true; this.messages = [...this.messages.map(x => ({...x}))]; // <- creates new references for the array and its contents! } 完整代码 import { Component } from '@angular/core'; import { Message, MessageService } from 'primeng/api'; @Component({ selector: 'sidebar-basic-demo', templateUrl: './sidebar-basic-demo.html', providers: [MessageService], }) export class SidebarBasicDemo { title = 'WECO'; notificationSideBarVisible = false; constructor(private messageService: MessageService) { messageService.messageObserver.subscribe((m: Message | Message[]) => { if (!Array.isArray(m)) { this.messages.push(m); } this.messages = [...this.messages]; }); } onShowNotificationSideBar() { this.notificationSideBarVisible = true; this.messages = [...this.messages.map(x => ({...x}))]; } count = 0; messages: Message[] = [ // { severity: 'success', summary: 'Success', detail: 'Message Content' }, // { severity: 'info', summary: 'Info', detail: 'Message Content' }, // { severity: 'warn', summary: 'Warning', detail: 'Message Content' }, // { severity: 'error', summary: 'Error', detail: 'Message Content' } ]; longSentence = 'Let’s end all this nonsense about how long sentences = run-on sentences. You can have a six-word run-on sentence (“I went shopping I ate donuts.”), while most of the sentences below are much, much longer than that and are not run-ons'; //'And let’s end all this nonsense about how long sentences = run-on sentences. You can have a six-word run-on sentence (“I went shopping I ate donuts.”), while most of the sentences below are much, much longer than that and are not run-ons (except for a few examples like Jose Saramago). But whether the sentence is grammatically correct isn’t nearly as important as whether the sentence is fun or beautiful.' showWarn() { let detail = 'User Deleted a Weco Rule'; if (this.count++ % 5 === 0) detail = this.longSentence; this.messageService.add({ severity: 'warn', summary: 'User Action', detail: detail, }); } showSuccess() { let detail = 'Weco Rule 123 Saved'; if (this.count++ % 5 === 0) detail = this.longSentence; this.messageService.add({ severity: 'success', summary: 'Service Call', detail: detail, }); } showError() { let detail = 'api-call:get-factories returned 404'; if (this.count++ % 5 === 0) detail = this.longSentence; this.messageService.add({ severity: 'error', summary: 'Service Call', detail: detail, }); } } html <div class="main"> <button type="button" (click)="onShowNotificationSideBar()" label="Show"> show sidebar </button> <p-sidebar [(visible)]="notificationSideBarVisible" position="right" [style]="{width:'50em'}" > <button type="button" pButton pRipple (click)="showSuccess()" label="S" class="p-button-success" > success </button> <button type="button" pButton pRipple (click)="showWarn()" label="W" class="p-button-warning" > warn </button> <button type="button" pButton pRipple (click)="showError()" label="E" class="p-button-danger" > error </button> <h3>Messages</h3> <h5>{{messages}}</h5> <p-messages [(value)]="messages" [enableService]="false"></p-messages> </p-sidebar> <p-toast position="center"></p-toast> </div> Stackblitz 演示

响应式布局中的全高侧边栏

我正在尝试创建一个带有全高侧边栏的响应式布局。在桌面上，侧边栏应浮动在主要内容的左侧，在平板电脑/移动设备上，侧边栏应与主要内容重叠...

将元素定位到高度的底部：100% div

我想将一个按钮“固定”到高度为 100% 的侧边栏 div 的底部，因为它应该填充页面的整个左侧。 我尝试这样做： .侧边栏{ 高度：10...

Offcanvas 组件不起作用，内容不显示

希望你一切都好！ 我有一个挑战要给你:)。我正在尝试在我的 Angular 项目中实现 Offcanvas 组件，它看起来可以工作，但是当我激活该组件时仅显示阴影

隐藏和显示右侧边栏[关闭]

所以，我正在尝试创建一个 JavaScript 或查询来隐藏右侧边栏 div。事实证明这比我预期的要困难得多，但我已经很接近了。 我创建了一个隐藏/显示右侧边栏，当

SwiftUI：从 NagivationLink 打开全屏视图（即隐藏侧栏）

我一直在研究苹果文档，寻找一种从导航链接打开视图的方法，其中侧边栏默认折叠。 我尝试过的所有操作都使侧边栏可见（但可折叠......