title: CoverView

sidebar_label: CoverView

覆盖在原生组件之上的文本视图,可覆盖的原生组件包括 map、video、canvas、camera、live-player、live-pusher,只支持嵌套 cover-view、cover-image,可在 cover-view 中使用 button。

支持度

微信小程序 H5 ReactNative 百度小程序 支付宝小程序 字节跳动小程序
✔️ x ️ ✔️ ✔️

具体属性参考相关小程序官网,属性值请改写为驼峰式命名。

微信小程序 cover-view

百度小程序 cover-view

支付宝小程序 cover-view

示例:
  1. import Taro, { Component } from '@tarojs/taro'
  2. // 引入 CoverImage, CoverView 组件
  3. import { Video, CoverImage, CoverView } from '@tarojs/components'
  4. class App extends Components {
  5. render () {
  6. return (
  7. <Video id='myVideo' src='src'>
  8. <CoverView class='controls'>
  9. <CoverView class='play' onClick='play'>
  10. <CoverImage class='img' src='src' />
  11. </CoverView>
  12. </CoverView>
  13. </Video>
  14. )
  15. }
  16. }