NervJS / taro

开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/
https://docs.taro.zone/
Other
35.55k stars 4.79k forks source link

live-player中同层组件在全屏后样式会变大 #16776

Open Lazydd opened 8 hours ago

Lazydd commented 8 hours ago

相关平台

微信小程序

小程序基础库: 3.6.3 使用框架: Vue 3

复现步骤

期望结果

里面的图片在全屏后不变

实际结果

图片被放大了

环境信息

👽 Taro v3.6.34

  Taro CLI 3.6.34 environment info:
    System:
      OS: Windows 10 10.0.22621
    Binaries:
      Node: 18.18.0 - C:\Program Files\nodejs\node.EXE
      Yarn: 1.22.19 - C:\Program Files\nodejs\yarn.CMD
      npm: 8.19.4 - C:\Program Files\nodejs\npm.CMD
    npmPackages:
      @tarojs/cli: 3.6.34 => 3.6.34 
      @tarojs/components: 3.6.34 => 3.6.34 
      @tarojs/helper: 3.6.34 => 3.6.34 
      @tarojs/plugin-framework-vue3: 3.6.34 => 3.6.34 
      @tarojs/plugin-platform-alipay: 3.6.34 => 3.6.34 
      @tarojs/plugin-platform-h5: 3.6.34 => 3.6.34
      @tarojs/plugin-platform-jd: 3.6.34 => 3.6.34
      @tarojs/plugin-platform-qq: 3.6.34 => 3.6.34
      @tarojs/plugin-platform-swan: 3.6.34 => 3.6.34
      @tarojs/plugin-platform-tt: 3.6.34 => 3.6.34
      @tarojs/plugin-platform-weapp: 3.6.34 => 3.6.34
      @tarojs/runtime: 3.6.34 => 3.6.34
      @tarojs/shared: 3.6.34 => 3.6.34
      @tarojs/taro: 3.6.34 => 3.6.34
      @tarojs/taro-loader: 3.6.34 => 3.6.34
      @tarojs/webpack5-runner: 3.6.34 => 3.6.34
      babel-preset-taro: 3.6.34 => 3.6.34
      eslint-config-taro: 3.6.34 => 3.6.34

补充信息

我给图片设置了宽高为80px,但是当我设置视频为全屏后,图片被放大了,此时我通过条件来修改样式,使他全屏后宽高为40,才是我要的效果

Lazydd commented 7 hours ago
<live-player class="video_box" id="video" :src="url" :autoplay="true">
  <view class="background">
    <image class="icon" src="./img/camera.png" />
  </view>
</live-player>