解决v-for轮播图中图片无法显示

2023-10-26

v-fo中src拿不到img的地址,图片无法显示
view可以打印出list.data中的img值,说明数组没问题,已经拿到图片值;
将src直接赋值地址,有图片显示,那么就是src没有拿到图片地址;
网页元素检查中也发现,这里的图片img中没有显示图片url;
所以是src没有拿到值;
解决:src中的地址被当成字符串解释,所以在后面的script里面的数组定义中,图片地址要加上require,也就是写成:
‘img’: require(‘…/…/…/static/friut.jpg’);
在这里插入图片描述

解决v-for轮播图中图片无法显示

	<view >
		<swiper class="swiper">
			<block v-for="(item,index) in lable" :key="index">
				<swiper-item>
					<block v-for="(listdata,index) in item" :key="index">
						<view>
							<!-- <view class="">
								{{listdata.imge}} 这里可以打印出.imge的地址,说明地址没问题,是src取不到值
							</view> -->
							<image :src="listdata.imge" mode="widthFix" style="width: 20upx;height: 20upx;"></image>
							<!-- <image :src=require("listdata.imge") mode="widthFix" style="width: 20upx;height: 20upx;"></image> -->
							<!-- <image src="../../../static/coen/dingwei.png" mode="widthFix" style="width: 20upx;height: 20upx;">src直接赋值也没有问题 就是src拿不到.img地址</image> -->
							<text>{{listdata.title}}</text>
						</view>
					</block>
				</swiper-item>
			</block>
		</swiper>
	</view>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

解决v-for轮播图中图片无法显示 的相关文章

随机推荐

  • python - 例题分析:工时与工资

    工时在120到180 工资80 工时 工时超过180 超过部分奖励20 工时不足120 扣10 t int input 输入工时 1退出 while t 1 if t gt 120 and t lt 180
  • 3 关于QT中的MainWindow窗口,MenuBar ToolBar QuickTip等方面的知识点

    首先给大家分享一个巨牛巨牛的人工智能教程 是我无意中发现的 教程不仅零基础 通俗易懂 而且非常风趣幽默 还时不时有内涵段子 像看小说一样 哈哈 我正在学习中 觉得太牛了 所以分享给大家 点这里可以跳转到教程 1新建一个空Qt项目 编写12M
  • TP框架中, _initialize函数使用return 语句无法返回相应内容,同时也无法终止脚本继续执行

    tp框架中 initialize函数使用return 语句无法返回相应内容 同时也无法终止脚本继续执行 在 initialize中如果想要返回值 需要 使用echo 如 echo json encode code gt 0 msg gt 请
  • synchronized对于加锁代码块、方法以及全局(static)锁的详细对比

    在网上看了许多关于synchronized的介绍及用法区别 大多大同小异 点到为止 个人推荐一篇博友写的 网址如下 http blog csdn net cs408 article details 48930803 这篇博客是介绍对象锁和类
  • LeetCode--标签:数组31.下一个排列

    LeetCode 31 下一个排列 做题笔记 题目描述 解题思路 代码 java 题目描述 实现获取下一个排列的函数 算法需要将给定数字序列重新排列成字典序中下一个更大的排列 如果不存在下一个更大的排列 则将数字重新排列成最小的排列 即升序
  • 目标检测之YOLO系列

    文章目录 YOLO 整体结构 YOLO的核心思想 实现方法 损失函数 训练 预测 优缺点 YOLO V2 模型结构 改进策略 训练 YOLO9000 YOLOv3 改进点 YOLOv3结构 与其他模型对比结果 YOLO 整体结构 源码 de
  • 系统-等保三级-CentOS Linux 7合规基线检查 shell脚本

    系统 等保三级 CentOS Linux 7合规基线检查 shell脚本 bin bash 基于阿里云最佳实践安全实践的CentOS Linux 7基线标准 系统 等保三级 CentOS Linux 7合规基线检查 修改密码最大有效期为18
  • ceph学习(3)——rbd-mirror双机热备

    一 概述 本文主要关注于rbd mirror的使用以及使用过程中的遇到的问题 二 环境准备 ceph版本 14 2 16 服务器 3台centos7服务器 ceph1 ceph2 ceph3 硬盘 每台服务器1块10GB以上硬盘做osd 分
  • <七>、Hadoop Web项目--HDFS文件管理

    本博客参考 http blog csdn net fansy1990 article details 51356583 一 项目介绍 推荐系统的web项目已经完成 现在在此基础上增加HDFS文件管理功能 便于管理HDFS上的文件数据 本文基
  • 面试题创作0009,请问Linux kernel中的spinlock_t 是如何实现互斥访问同一数据的?

    面试题创作0007 请问Linux kernel中的spinlock t 是如何实现互斥访问同一数据的 在单核多线程 多核多线程 多cpu多线程中 spinlock t实现互斥的机制有区别么 分别是什么呢 进一步列举一些使用spinlock
  • PLC是如何控制伺服电机的?

    在回答这个问题之前 首先要清楚伺服电机的用途 相对于普通的电机来说 伺服电机主要用于精确定位 因此大家通常所说的伺服控制 其实就是对伺服电机的位置控制 其实 伺服电机还用另外两种工作模式 那就是速度控制和转矩控制 不过应用比较少而已 速度控
  • Java通过反射模拟冰蝎免杀功能

    一 Java反射 java反射算是java学习过程中不可绕过的一关 java 反射 反射允许运行中的Java程序获取自身的信息 并且可以操作类或对象的内部属性 反射的核心是JVM在运行时动态加载类或调用方法或访问属性 class 类 我们正
  • 前端模块化:匿名闭包、CommonJS、ES6模块化

    ES5时 用匿名函数实现的模块化 通过将代码放在闭包当中 使得命名不会冲突 每一个js文件都成为独立的模块 需要复用代码时 将闭包中的结构返回到全局作用域即可 通过模块名 方法 属性的方法使用 a js var moduleA functi
  • 2022年第十四届“华中杯”大学生数学建模挑战赛

    2022年第十三届 华中杯 大学生数学建模挑战赛 为了推广我国高校数学建模实践教学 培养学生的创新意识及运用数学方法和计算机技术解决实际问题的能力 第十四届 华中杯 大学生数学建模挑战赛 以下简称竞赛 将于2022年3月开始 举办竞赛的目的
  • 【无标题】力扣链表总结

    k个一组反转链表 25 前置知识1 2 反转整个链表 反转以 a 为头结点的链表 ListNode reverse ListNode a ListNode pre cur nxt pre null cur a nxt a while cur
  • 1.网络工程基础知识

    目录 1 1 网络工程的定义 1 可以通过以下几个方面加强对工程的了解 2 网络工程属于IT集成工程 1 2 网络工程实施原则 1 从网络整体性能上考虑 IT工程实施需要遵守以下原则 2 从企业成本考虑 IT工程实施则需要遵守以下一些原则
  • Windows下自定义文件类型如何双击打开,如何双击文件后都在一个实例中打开

    1 要实现文件双击打开 需要在注册表中将文件类型与要打开文件的程序相关联 在HKEY CURRENT USER Software Classes 或者 HKEY LOCAL MACHINE Software Classes 下创建 xxxx
  • 【贪心算法】最优服务次序问题

    算法实现题 4 6 最优服务次序问题 设有n个顾客同时等待一项服务 顾客i需要的服务时间为ti 应如何安排n个顾客的服务次序才能使平均等待时间达到最小 平均等待时间是n个顾客等待直到完成服务的时间总和除以n 对于给定的n个顾客需要的服务时间
  • gp 索引列表查询,表字段类型,字段注释查询

    所有索引列表 SELECT n nspname as Schema c relname as Name c2 relname as Table FROM pg catalog pg class c JOIN pg catalog pg ro
  • 解决v-for轮播图中图片无法显示

    v fo中src拿不到img的地址 图片无法显示 view可以打印出list data中的img值 说明数组没问题 已经拿到图片值 将src直接赋值地址 有图片显示 那么就是src没有拿到图片地址 网页元素检查中也发现 这里的图片img中没