当前位置: 首页 > news >正文

uniapp-商城-26-顶部模块折叠

主要是为了更多展示商品,需要对头部进行折叠。

将客服和后台隐藏不显示,将logo和名称栏目显示到胶囊处,将码 隐藏 将店铺介绍隐藏,将logo缩小,将店名缩小显示。

代码:使用一个tag 来表示需要折叠  这里就是 foldstate

将这里的foldstate  传递到组件  :

组件:获取到该值 :shop headbar 组件

设置到客服:flod

设置到body 就是logo栏目  flod

计算高度变化: flodstate

设置flod的样式,其他没有设置的样式就继承前面设置的:

设置页面折叠的 慢动作: transition 以及注意这里的   img 100%  被继承(就是logo图片完全显示)

没有慢动作 折叠就会显得有些生硬


http://www.mrgr.cn/news/98882.html

相关文章:

  • 逻辑回归 (Logistic Regression)
  • vue3中defineEmits的使用说明
  • 【MySQL】MySQL数据库的基础操作、常用数据类型、表结构的操作
  • nginx-基础知识(一)
  • Haclon的学习网址
  • Java深入
  • Qt信号与槽
  • golang处理时间的包time一次性全面了解
  • uniapp-商城-26-vuex 使用流程
  • 强化学习算法系列(五):最主流的算法框架——Actor-Critic算法框架
  • Ubuntu源码制作openssh 9.9p2 deb二进制包修复安全漏洞 —— 筑梦之路
  • Rust 中的Relaxed 内存指令重排演示:X=0 Y=0 是怎么出现的?
  • 抽象的https原理简介
  • SQL刷题记录贴
  • 机器学习 | 细说Deep Q-Network(DQN)
  • 【Python爬虫基础篇】--1.基础概念
  • git撤销提交
  • C++面试
  • 定制化 Docsify 文档框架实战分享
  • 常见的服务器硬盘接口