iview的走马灯嵌套在模态框中,宽度为0的解决方案

简介: iview的走马灯嵌套在模态框中,宽度为0的解决方案

在项目开发中用到了iview的走马灯嵌套在模态框中这种需求,结果发现走马灯图片不显示,打开控制台审查元素发现走马灯的内部盒子width为0,自己感觉在页面初始化的时候,因为模态框初始值为false,所以,走马灯渲染的时候错误的动态计算了宽度,为0,所以解决方案为让模态框和走马灯通过统一状态控制,同时渲染。你可以将Modal 的v-model="imgVisible"这个状态值同步到走马灯的<Carousel v-if="imgVisible"></Carouse>,或者如下,图片集合有值了在渲染,两者都可以、

  <Modal title="查看凭证" v-model="imgVisible" :transfer="false">
        <div class="img-box">
          <Carousel v-if="imgList && imgList.length>0" class="Carousel" arrow ="always">
            <CarouselItem v-for="url in imgList" :key="url" class="CarouselItem">
              <img :src="url" style="width: 100%" />
            </CarouselItem>
          </Carousel>
          <p v-else>暂无凭证</p>
        </div>
      </Modal>
相关文章
|
存储 NoSQL 关系型数据库
支持中低频量化交易的单机数据平台
支持中低频量化交易的单机数据平台,使用InfluxDB存储实时交易数据,HDF5存储静态历史数据用于回测。
5971 0
|
3月前
|
存储 运维 数据管理
告别“大海捞针”:OSS Vector Bucket 如何赋能媒资管理平台
在 AI 时代,媒资平台面临多模态数据爆炸式增长的管理挑战。阿里云 OSS Vector Bucket 提供统一向量存储与语义检索能力,支持 30 亿级素材秒级精准查找,打破数据孤岛,降低成本,助力内容创作提效降本。
394 11
|
4月前
|
人工智能 API Python
办公Agent如何真正提效?用数据对比说明:介入前后团队时间消耗变化
这是一份真实办公提效实验报告:20人团队引入办公Agent后,事务与沟通时间骤降56%,人均每周多出9小时有效工作时间。数据揭示——AI不替代人,而是接管填表、催办、写纪要等低价值衔接工作,让人回归核心创造。(239字)
449 7
|
6月前
|
人工智能 语音技术 iOS开发
找到了多个 **Kokoro 量化版本** 可以下载
Kokoro语音合成模型提供多种量化版本:FP32(350MB)、FP16(169MB)、INT8/Q8(约100–103MB)、Q4及AMD NPU优化版,适配桌面、移动端、浏览器与嵌入式设备。支持GitHub、HuggingFace、npm多源下载,兼顾体积与性能。
蓝绿部署
蓝绿部署通过两套并行系统(绿为现役,蓝为新版本)实现无缝发布。蓝系统用于测试验证,无误后切换流量,确保快速回滚与高可用,适用于内聚性强、易切换的系统,但复杂场景需谨慎评估数据同步与切换逻辑。
|
9月前
|
SQL 数据库 索引
3.1索引创建的原则 ?
创建索引需遵循六大原则:针对大数据量、高频查询表;在查询、排序、分组字段建索引;优先高区分度列,可建唯一索引;varchar字段建议用前缀索引;多用联合索引且高区分度字段前置;避免过多索引影响维护效率。
|
JavaScript 前端开发 API
详解JS的URL()和URLSearchParams() API接口
详解JS的URL()和URLSearchParams() API接口
671 2
|
算法 搜索推荐
数据结构与算法学习十一:冒泡排序、选择排序、插入排序
本文介绍了冒泡排序、选择排序和插入排序三种基础排序算法的原理、实现代码和测试结果。
736 0
数据结构与算法学习十一:冒泡排序、选择排序、插入排序
|
前端开发 JavaScript
前端 JS 经典:Math 常用方法汇总
前端 JS 经典:Math 常用方法汇总
366 0
|
存储 缓存 Java
Android性能优化:内存管理与LeakCanary技术详解
【7月更文挑战第21天】内存管理是Android性能优化的关键部分,而LeakCanary则是进行内存泄漏检测和修复的强大工具。

热门文章

最新文章