请问在小程序里怎么实现那种底部悬浮层d出的效果?

请问在小程序里怎么实现那种底部悬浮层d出的效果?,第1张

效果展示

通过在界面素材中添加一个底部悬浮层,同时配置触发器行为打开悬浮层,实现一个底部悬浮层d神粗出的效果。

添加悬浮层

点击左侧导航栏的界面。

添加一个底部悬浮层。

触发器配置

注意:在检知升查器面板中的触发器设置面板创建触发器,可以对组件进行交互逻辑设置,或配合事件来进行动态数据 *** 作。

选中图标。

点击检查面板中的触发器。

创建触发器。

选中悬浮层中的微信图标。

点击检查面板中的触发器。

配置打开分搭瞎老享面板触发器。

测试发现 小程序组件(这里指底部导航组件)生命周期的attached 不支持 *** 作 也就是 当想修改底部导航的内容是不支持的

所以上述写法会出现惊奇的结果 哈哈 可以自行运行看看

先了解一下小程序组件的生命周期

[图片上传中...(image-9202b1-1629959126527-0)]

于是我使用了ready 测试发现 部液肢分安卓机 可以 *** 作数据 但是页面底部导航不会更新

看文档发现:

自小程序基础库版本 2.2.3 起,组件的的生命周期也可以在 lifetimes 字段内进行声明(这是推荐的方式,其优先级最高)。

于是, (这里是在小程序底部导航组件里写这个方法)

测试发现 还是没有更改过来

找戚裂资料看到

即高埋闭可

一.创建并使用组件的步骤

1.创建一个文件夹存放组件,并在里面创建一个组件文件夹,components,tabs

2.在tabs文件里添加组件模板

3.引用组件,在父组件的json文件中配闭的usingComponents中添加子组件路径,compont

4.使用组件,相当于正常标签进行使用

二.父组件向子组件传参的步骤

父组件给子和局组件的tabs传入对象

1.父组件的数据

2.子组件做的 *** 作

如果没有传入数据,就会输出默认值value

3.子组件展示对唤卖让象数据:

三.子组件向父组件传参的步骤

1.先给子组件添加一个点击事件

2.通过this.triggerEvent("自定义事件名称",{传的值})命令保证子组件和父组件同步被修改

3.父组件绑定子组件,定义一个事件名称,用来接收子组件传递的数据


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12518047.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-26
下一篇 2023-05-26

发表评论

登录后才能评论

评论列表(0条)

保存