小程序--组件--视图容器

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序--组件--视图容器相关的知识,希望对你有一定的参考价值。

参考技术A

日常记录学习~~

参数参考官方文档: https://developers.weixin.qq.com/miniprogram/dev/component/cover-image.html

cover-image:覆盖在原生组件之上的图片视图,支持嵌套在 cover-view 里

cover-view:覆盖在原生组件之上的文本视图,支持嵌套 cover-view 、 cover-image ,可在 cover-view 中使用 button

原生组件有:map,video,canvas,camera,live-player,live-pusher

参数参考官方文档: https://developers.weixin.qq.com/miniprogram/dev/component/match-media.html

match-media:media query 匹配检测节点,指定一组 media query 规则,满足时,这个节点才会被展示。

参数参考官方文档: https://developers.weixin.qq.com/miniprogram/dev/component/movable-area.html

movable-area:是movable-view的可移动区域,必须设置width和height属性,不设置默认为10px

movable-view:可移动的视图容器,在页面中可以拖拽滑动,movable-view必须在movable-area组件中使用,并且必须是直接子节点,否则不能移动。

参数参考官方文档: https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html

page-container:“假页”容器组件,效果类似于 popup 弹出层,页面内存在该容器时,当用户进行返回操作,关闭该容器不关闭页面,当前页面最多只有 1 个容器,若已存在容器的情况下,无法增加新的容器

参数参考官方文档:
https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html

scroll-view:可滚动视图区域,使用竖向滚动时,需要给一个固定高度,组件属性的长度单位默认为px

参数参考官方文档:
https://developers.weixin.qq.com/miniprogram/dev/component/share-element.html
具体使用可看官方案例哦

share-element:共享元素,该组件需与page-container组件结合使用

swiper:滑块视图容器,其中只可放置swiper-item组件,否则会导致未定义的行为。

swiper-item:仅可放置在swiper组件中,宽高自动设置为100%

这是我们最熟悉的容器啦~

以上是关于小程序--组件--视图容器的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序View视图容器组件

微信小程序视图容器和基本内容组件

7-小程序的组件

微信小程序 | 实战开发常用的视图容器类组件介绍和使用

微信小程序之视图容器(swiper)组件创建轮播图

微信小程序wxss设置样式