百度智能小程序 圖片視圖

cover-image 圖片視圖

解釋：覆蓋在 原生組件 之上的圖片視圖（與 cover-view 相比，僅支持圖片）,支持嵌套在 cover-view 里。

屬性說明

示例 

在開發(fā)者工具中打開

代碼示例 ：圖片視圖

• SWAN
• JS
• CSS

<view class="wrap">
    <view class="card-area">
        <map 
            class="map"
            longitude="{{longitude}}"
            latitude="{{latitude}}">
            <cover-image 
                class="cover-image"
                src="https://b.bdstatic.com/miniapp/image/cover-image.png" rel="external nofollow" 
                bindload="imageLoad"
                binderror="imageError">
            </cover-image>
        </map>
    </view>
</view>

Bug & Tip

• Tip：支持 css transition 動畫，transition-property 只支持 transform (translateX, translateY) 與 opacity。Tip：文本建議都套上 cover-view 標(biāo)簽，避免排版錯誤。
• Tip：只支持基本的定位、布局、文本樣式。不支持設(shè)置單邊的 border、background-image、shadow、overflow: visible 等。
• Tip：建議子節(jié)點不要溢出父節(jié)點。
• Tip：默認(rèn)設(shè)置的樣式有：white-space: nowrap; line-height: 1.2; display: block。
• Tip：建議不要頻繁改變 s-if 表達(dá)式的值控制顯隱，否則會導(dǎo)致 cover-view 顯示異常。
• Bug：IOS 端暫不支持一個頁面有多個 video 時嵌套 cover-view。
• Tip：cover-view 和 cover-image 從基礎(chǔ)庫版本 1.12.0 開始支持事件捕獲、冒泡。
• Tip：cover-image 和 cover-view 的渲染順序與頁面中的標(biāo)簽使用順序一致。