当前位置: 首页 > news >正文

九宫格 图片 自定义 路径

<image :src=" '../../static/img/' + item.urlname + '.png' "  class="u-w-82 u-h-82 u-p-t-36"></image>

使用场景:九宫格里含有多张图片
在这里插入图片描述
html

<view class="u-p-b-46 u-p-x-35"><u-grid :border="false" col='5'  @click="clickbase" ><u-grid-item v-for="(item,index) in baseList" :key="index"><image :src=" '../../static/img/' + item.urlname + '.png' "  mode="" class="u-w-82 u-h-82 u-p-t-36"></image><text class="u-m-t-15">{{item.title}}</text></u-grid-item></u-grid></view>	

js

	baseList: [{urlname: '1',title: '论文查重'},{urlname: '2',title: '代取快递'},{urlname: '3',title: '代办跑腿'},{urlname: '4',title: '返乡订票'},{urlname: '5',title: '旅游团建'},{urlname: '6',title: '在线课堂'},{urlname: '7',title: '在线点餐'},{urlname: '8',title: '校园小说'},{urlname: '9',title: '校园活动'},{urlname: '10',title: '校园二手'},{urlname: '11',title: '考研考公'},{urlname: '12',title: '雅思托福'},{urlname: '13',title: '周边兼职'},{urlname: '14',title: '社会百科'},{urlname: '15',title: '特惠电影'},],

在这里插入图片描述

http://www.lryc.cn/news/237643.html

相关文章:

  • Leetcode经典题目之“双指针交换元素“类题目
  • 计算机基础知识54
  • 深度系统(Deepin)开机无法登录,提示等待一千五百分钟
  • 工具及方法 - 多邻国: Duolingo
  • Redis篇---第十一篇
  • linux CentOS7 安装git 配置秘钥公钥克隆代码
  • 深度学习之生成唐诗案例(Pytorch版)
  • 算法设计与分析算法实现——删数问题
  • 基于Vue+SpringBoot的超市账单管理系统 开源项目
  • 【Linux 内核分析课程作业 1】mmap 实现一个 key-valueMap
  • docker compose使用教程(docker-compose教程)
  • 印刷企业实施MES管理系统需要哪些硬件设施
  • Java JSON字符串替换其中对应的值
  • Android VSYNC发展历程
  • 外呼系统作用和优势有哪些okcc,ai源码
  • 智元机器人岗位内推
  • el-popover和el-tooltip样式修改(普通的组件样式修改方法,对popover是不生效的)
  • 【AI实用技巧】GPT写sql统计语句
  • LeetCode(31)无重复字符的最长子串【滑动窗口】【中等】
  • 天猫超市电商营销系统:无代码开发实现API连接集成
  • element表格分页+数据过滤筛选
  • 小程序判断是否授权位置信息和手动授权
  • 2023年亚太杯数学建模亚太赛A题思路解析+代码+论文
  • 【Android】画面卡顿优化列表流畅度六(终篇)
  • 一文了解:离散型制造业轻量化MES解决方案
  • 《云计算:云端协同,智慧互联》
  • Java stream流 常用记录
  • Spring Security6 用户身份认证
  • 钩子函数-hook
  • 拉链表-spark版本