如何将Vuetify对话框标题固定在顶部并使按钮始终可见
Vuetify是一个基于Vue.js的开源UI组件库，它提供了丰富的组件和样式，可以帮助开发者快速构建漂亮的前端界面。其中，对话框是Vuetify中常用的组件之一，用于显示弹出式的对话框内容。
要将Vuetify对话框标题固定在顶部并使按钮始终可见，可以通过以下步骤实现：
- 首先，确保已经安装并引入了Vuetify库。可以通过npm或者CDN方式引入Vuetify。
- 在Vue组件中，使用
v-dialog标签创建对话框组件，并设置v-model属性来控制对话框的显示与隐藏。
<template>
<v-dialog v-model="dialogVisible">
<!-- 对话框内容 -->
</v-dialog>
</template>- 在对话框组件内部，使用
v-card标签创建卡片容器，并设置flat属性来去除卡片的阴影效果。
<template>
<v-dialog v-model="dialogVisible">
<v-card flat>
<!-- 对话框内容 -->
</v-card>
</v-dialog>
</template>- 在卡片容器内部，使用
v-toolbar标签创建工具栏，并设置fixed属性来固定工具栏在顶部。
<template>
<v-dialog v-model="dialogVisible">
<v-card flat>
<v-toolbar fixed>
<!-- 工具栏内容 -->
</v-toolbar>
<!-- 对话框内容 -->
</v-card>
</v-dialog>
</template>- 在工具栏内部，使用
v-toolbar-title标签创建标题，并将标题内容放置在其中。
<template>
<v-dialog v-model="dialogVisible">
<v-card flat>
<v-toolbar fixed>
<v-toolbar-title>
<!-- 标题内容 -->
</v-toolbar-title>
</v-toolbar>
<!-- 对话框内容 -->
</v-card>
</v-dialog>
</template>- 最后，在对话框组件内部，使用
v-card-actions标签创建操作按钮容器，并将按钮放置在其中。
<template>
<v-dialog v-model="dialogVisible">
<v-card flat>
<v-toolbar fixed>
<v-toolbar-title>
<!-- 标题内容 -->
</v-toolbar-title>
</v-toolbar>
<!-- 对话框内容 -->
<v-card-actions>
<!-- 操作按钮 -->
</v-card-actions>
</v-card>
</v-dialog>
</template>通过以上步骤，我们可以将Vuetify对话框标题固定在顶部，并使按钮始终可见。你可以根据实际需求，自定义对话框的样式和布局。
关于Vuetify的更多信息和详细使用方法，你可以参考腾讯云的Vuetify产品介绍页面：Vuetify产品介绍。
相关·内容
我试图在滚动时保持Vuetify对话框标题和内容的标题固定在顶部。我使用了"style:"position:fixed“。当我滚动的时候，标题和标题就会从视图中消失。 v-layout>
</v-dialog>
</
浏览 88提问于2019-09-21得票数 3
回答已采纳
3回答
在我的页面顶部有我的标题和导航，当我向下滚动页面时，标题不在可见的窗口中，我想用一个按钮滑下(从顶部)另一个DIV (然后固定在顶部并始终可见)。如果用户滚动回到我的页面顶部，标题就会出现在可见窗口中，我固定的带有按钮的DIV必须消失。
浏览 1提问于2016-07-09得票数 0
3回答
在我的角度项目中有一个<div></div>，当用户单击“编辑”按钮来编辑表格中的字段时，它会显示一个对话框。 position: relative; right: 50px;}
我希望“关闭”按钮从对话框的右边稍微显示出来，但就其所在的位置而言，
浏览 1提问于2018-09-25得票数 0
回答已采纳
我想要一个对话框，保持在我的主窗口之上，而不是其他窗口。我派生了一个类并添加了一些标志。如果我现在用show()调用对话框，对话框就会出现，并保持在顶部，只要我不按按钮或其他什么。然后对话框再次转到后台。工具窗口通常是一个小窗口，其标题栏和装饰比通常要小，通常用于工具按钮的集合。如果有父窗口，工具窗口将始终保持在它的顶部。
幸运的是，我将这一行添加到我的单例创建对话框
浏览 6提问于2017-09-22得票数 5
我在对话框中有一个列表视图，然后我必须使用页眉布局和页脚布局。我这样做，使我的页眉布局与顶部和页脚布局到底部。但它有个问题。看看下面的图片..。
我被困在这种情况下。好吧，如果我把我的页脚和列表视图末端对齐，那么页脚就会离开屏幕。这也是意料之外的。我想要的:
我希望我的列表视图应该在对话框中心可见，标题布局对齐顶部，页脚布局与对话框瓶盖边框的引导对齐，它不应该占用屏幕
浏览 1提问于2016-11-22得票数 0
1回答
响应中的html宽度
、、、
我还希望将标题固定在顶部，并希望表高填充窗口高度(tbody有滚动)。
我需要弹出的div宽度始终保留表的前两列，并覆盖其余的列，并且它需要响应。前两列应该总是可见的。我将25%的宽度应用于前两列，然后使用以下jquery设置弹出窗口的宽度。为了使它响应，我应用了相同的DataTable JQuery，但是头(头)没有占用弹出di
浏览 0提问于2016-03-04得票数 0
1回答
其他两个表格用于浮动在顶部，并显示按钮和表格标题，这些按钮和表格标题始终可见。如何使“浮动在顶部”的表格与数据表(带有MoreInformation的表格)一起移动？附注:我试着把这两个表放在一个分区中，使那个分区position:fixed和position:relative中的表，但它不起作用。
浏览 2提问于2015-07-15得票数 0
1回答
我正在尝试使一个div是可拖动的，并绑定到另一个容器div (浅黄色)。使用jquery和jquery-UI，我设法让它工作(代码笔项目 )。现在我错过了下一步。我在可拖动的标题div上有一个(红色)按钮，它将切换包含其他细节的body div的可见性。我还希望这些详细信息始终显示在我的容器中。现在，如果我将我的(橙色)头文件div拖到它的容器的底部，并打开body details (金色) div，它将出现在容器之外。有没有办法避免这种情况，因为我希望有可能将头部拖到
浏览 2提问于2019-02-03得票数 0
此选项卡中的想法是用户可以通过复选框选择项目并执行“我想”下拉列表中的操作(这将根据操作打开不同的模式对话框)。列表中项目右侧的3点省略号允许用户通过另一个下拉控件执行相同的操作，其理念是使用顶部的下拉菜单对多个项目执行操作，即一个项目的省略号三点菜单。我最初的想法是提供一个浮动的操作按钮。然后用户可以*以某种方式*(我还没有想到一个想法，至少是一个更大的复选框)选择多个项目，然后通过浮动的操作按钮选择他们想要做的事情，这个按钮总是在屏幕的边界内，而不是可怕的滚动回到顶部</em
浏览 0提问于2017-10-06得票数 0
3回答
我最初的想法是让菜单从顶部滑入，butI不确定如何实现这一点，所以我的下一个想法是在移动菜单的某个地方有一个“关闭”X，甚至是“关闭”这个词，这样就可以让菜单滑回来…… -webkit-transform: translateX(0); }所以，我想我要么想学习如何从顶部滑动它，要么在打开时如何在菜单中添加一个关闭按钮？
浏览 0提问于2017-05-09得票数 0
回答已采纳
如果用户位于列表的顶部，显示标题，并且列表被更新为新项，则标题将保持在顶部，这意味着前面看到的项目将被新项推开。黑色矩形显示列表中可见的部分。如您所见，在加载之前，可见部分具有标头和一些项，加载后仍然有标头和一些项，但这些是推开旧项的新项。只有当
浏览 0提问于2018-04-10得票数 7
我正在编写vs代码扩展，以便在侧栏的内置视图中创建始终可见的按钮，但我无法使其中一些按钮位于视图容器的顶部。还有一些视图，我只能在视图未折叠时才能使它们出现，而有些视图则根本不会出现！活动栏上的“扩展”在“已启用”和“推荐”视图上正确显示了我的HelloWorld按钮。
为什么HelloWorld按钮没
浏览 4提问于2020-05-07得票数 2
标头被附加到父文件的顶部并水平地填充它。页脚连接到父级的底部，并且水平地填充它。内容应该填充页眉和页脚之间的所有空格。
父母必须有固定的宽度和高度。内容DIV必须填充页眉和页脚之间的所有可用空间。当内容DIV的内容大小超过页眉和页脚之间的空间时，内容DIV应该显示滚动条，并允许适当的滚动，这样页脚内容就不应该模糊，页脚内容也不应该模糊。父DIV将具有一个固定但未知大小的(例如，它将与浏览器视图的大小完全相同，并根据用户对浏览器窗口的大小进行调整)。让我们称父DIV为“屏幕”。标头将包含一组筛选控件(如文本框、下拉列表和“筛
浏览 15提问于2008-09-11得票数 8
2回答
我的应用程序要求用户通过tapp/拖动来选择一个时间段，当他们停止拖动时，会出现一个对话框来确认他们的时间选择。然后，用户单击ok以注册时间或单击cancel。问题是，当在移动浏览器中使用此页面时，用户向下滚动到标题的视线之外，选择一个时间，对话框打开(背景块)，但停留在标题中(居中)，从而要求用户向上滚动以确认或取消。对话框被锁定在顶部，所以我确定它是我的css。让我解释一下我的设置。
我使用WURFL库进行设备检测，因此每个设备都有一个.css部分，如下所
浏览 0提问于2012-08-01得票数 0
回答已采纳
我在我的移动应用程序的顶部有一个名为position:fixed的div，所以它将停留在浏览器的顶部(它在iOS4和更低版本中滚动离开，这是很好的)。当输入被聚焦并弹出键盘时，div向下移动到页面的中间。
浏览 0提问于2011-11-09得票数 15
button" class="btn btn-primary">Save changes</button> </div></div>
Role=“对话框
浏览 2提问于2014-05-22得票数 0
回答已采纳
我希望顶部的两个是固定的高度，底部的一个填充其余的空间。对话框的大小是可调整的，所以所有的对话框都应该改变宽度，底部的对话框应该改变高度。这一点很重要，用户必须能够伸展表单，以及通过代码的程序。我将使用按钮控制面板的隐藏/显示。我的想法是在窗体中显示“高级”模式的某些面板，而在“简单”模式下隐藏它们。如果我隐藏了一个面板，我不能有一堆空白，我想让窗体在简单模式下缩小一堆。我尝试过在面板停靠到顶部时执行此操作，但用户调整窗体大小不会改变面板高度。这就是我请求帮助的主要技巧。
浏览 0提问于2014-01-03得票数 7
我正在FB发送按钮工作，并在一个新的网站上实施它。问题是FB在单击发送按钮时显示的弹出按钮位于发送按钮下方。谁能告诉我如何设置“弹出按钮”(在单击发送按钮时出现的对话框)可以自定义为显示在发送按钮的上方而不是下方。
提前感谢！
浏览 0提问于2011-06-14得票数 6
回答已采纳
3回答
顶部视图的高度最小，达到此高度时会变得粘稠。底部视图承载一个分页控制器，其中包含三个视图。这些视图中的每一个都有一个集合视图或具有垂直滚动的表视图。
我真的不知道该怎么处理这个问题。整个视图是否可以滚动，我应该防止在第二个视图上滚动，直到顶部视图达到粘性高度？或者这些视图中的每一个都是单独的uitableviews视图，而分页控制器只是一个单元格吗？
浏览 3提问于2014-09-06得票数 3
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
