日常記錄學(xué)習(xí)~~
1、cover-image和cover-view
參數(shù)參考官方文檔：https://developers.weixin.qq.com/miniprogram/dev/component/cover-image.html
cover-image：覆蓋在原生組件之上的圖片視圖培廓，支持嵌套在cover-view里
<cover-view>
<cover-image></cover-image >
</cover-view>
cover-view：覆蓋在原生組件之上的文本視圖桐早，支持嵌套 cover-view、cover-image诞挨，可在cover-view中使用button
<cover-view >
<cover-view></cover-view>
</cover-view>
原生組件有：map碍粥，video囚灼，canvas骆膝，camera，live-player灶体，live-pusher
使用場(chǎng)景：
1.視頻在全屏的情況下阅签，想要在視頻上添加一些文本或圖片時(shí)，可以使用
2.使用地圖時(shí)蝎抽，想要在地圖上方添加文本或圖片時(shí)可使用 等等政钟。路克。。
---這個(gè)組件類似于z-index---
2养交、match-media
參數(shù)參考官方文檔：https://developers.weixin.qq.com/miniprogram/dev/component/match-media.html
match-media：media query 匹配檢測(cè)節(jié)點(diǎn)精算，指定一組 media query 規(guī)則，滿足時(shí)碎连，這個(gè)節(jié)點(diǎn)才會(huì)被展示灰羽。
<match-media min-width="300" max-width="600">
<view>當(dāng)頁面寬度在 300 ~ 500 px 之間時(shí)展示這里</view>
</match-media>
使用場(chǎng)景：
頁面寬高在某個(gè)范圍時(shí)才展示出來
---這個(gè)組件類似于@media---
3、movable-area和movable-view
參數(shù)參考官方文檔：https://developers.weixin.qq.com/miniprogram/dev/component/movable-area.html
movable-area：是movable-view的可移動(dòng)區(qū)域鱼辙，必須設(shè)置width和height屬性廉嚼，不設(shè)置默認(rèn)為10px
movable-view：可移動(dòng)的視圖容器，在頁面中可以拖拽滑動(dòng)倒戏，movable-view必須在movable-area組件中使用怠噪，并且必須是直接子節(jié)點(diǎn)，否則不能移動(dòng)杜跷。
<movable-area>
<movable-view></movable-view>
</movable-area>
使用場(chǎng)景：適用于實(shí)現(xiàn)拖拽滑動(dòng)的需求
4傍念、page-container
參數(shù)參考官方文檔：https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html
page-container：“假頁”容器組件，效果類似于 popup 彈出層葛闷，頁面內(nèi)存在該容器時(shí)捂寿，當(dāng)用戶進(jìn)行返回操作，關(guān)閉該容器不關(guān)閉頁面孵运，當(dāng)前頁面最多只有 1 個(gè)容器，若已存在容器的情況下蔓彩，無法增加新的容器
5治笨、scroll-view
參數(shù)參考官方文檔：
https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html
scroll-view：可滾動(dòng)視圖區(qū)域，使用豎向滾動(dòng)時(shí)赤嚼，需要給一個(gè)固定高度旷赖，組件屬性的長(zhǎng)度單位默認(rèn)為px
<scroll-view scroll-y="true" style="height: 300rpx;" >
<view></view>
</scroll-view>
使用場(chǎng)景：適用于頁面數(shù)據(jù)較多時(shí)內(nèi)容可滾動(dòng)查看
6、share-element
參數(shù)參考官方文檔：
https://developers.weixin.qq.com/miniprogram/dev/component/share-element.html
具體使用可看官方案例哦
share-element：共享元素更卒，該組件需與page-container組件結(jié)合使用
<page-container>
<share-element>
<image />
</share-element>
</page-container>
7等孵、swiper和swiper-item
swiper：滑塊視圖容器，其中只可放置swiper-item組件蹂空，否則會(huì)導(dǎo)致未定義的行為俯萌。
swiper-item:僅可放置在swiper組件中，寬高自動(dòng)設(shè)置為100%
<swiper>
<block wx:for="{{xxx}}" wx:key="index">
<swiper-item>
<view>{{item}}</view>
</swiper-item>
</block>
</swiper>
使用場(chǎng)景：就是左右滑動(dòng)的情況啦
8上枕、view
這是我們最熟悉的容器啦~
