底部操作条:
5
最新!
底部操作条使用 l-bar 标签,添加 dark 属性可以改为深色操作条;
内部按钮使用 l-bar-item 标签,添加 title 属性设置标题文字,添加 icon 属性设置按钮图标,添加 color 属性设置颜色;
按钮角标 l-tag 可以放置于 l-bar-item 标签中的默认插槽内;
按钮标题文字可以放置于 l-bar-item 标签中的名为 title 的插槽内
带圆形突出按钮:
在 l-bar-item 标签上添加 type="round" 属性即可适用圆形突出按钮
带大块按钮:
大块按钮需要使用 l-bar-item-button 标签,可以设置 title、color 属性
标题栏:
默认标题
长圆点标题
下划线标题
变色下划线标题
扩散下划线标题
带副标题标题文字
带扩散副标题的标题文字
标题栏使用 l-title 标签;添加 long 属性即设为长圆点标题;color 属性可以设置颜色;
设置 type 属性为 underline 或 blurUnderline 可以设为带有下划线或扩散下划线的样式;
设置 type 属性为 colorfulUnderline 可以设为带有变色下划线样式,注意变色下划线的颜色无法更改;
设置 type 属性为 nextSubtitle 或 blurSubtitle 可以设为带有副标题或者扩散副标题的样式;
副标题通过名为 subtitle 的属性或者插槽来设置
顶部操作栏:
基础操作条
返回操作条
返回
复杂操作条
首页
顶部操作条使用 l-banner 标签;名为 left、right 的插槽内容将渲染到操作条左侧、右侧的位置;
可以设置 color 属性来修改操作条的背景色;默认插槽中的内容将渲染到操作条的中间
搜索操作栏:
当前搜索框:{{ searchText }}
给 l-banner 添加属性 type="search" 即可设为搜索操作条;添加 fill 属性即可设为填充型样式;
名为 searchInput、searchButton 的插槽将渲染到搜索输入框、搜索按钮上;搜索框输入内容将绑定 v-model 上