uniapp小程序src引用服务器图片时全局变量与图片路径拼接

最新推荐文章于 2024-08-20 10:22:29 发布
最新推荐文章于 2024-08-20 10:22:29 发布
阅读量7k 收藏 12
点赞数 1
文章标签： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Da6668_lei/article/details/108873065
版权

为了处理微信小程序在真机调试，文件过大，所以把图片放在服务器上，在引入图片时遇到标签内引入全局变量与图片的拼接时遇到了困难，我总觉得有更好的方法，不过我搜索不到想要的答案，就将自己的总结附上吧
1、将图片资源部署到服务器后，在main.js定义全局变量
在这里插入图片描述
初始化变量，用来保存引入的全局变量，才可以引用到标签内去，至于原理是什么，我也不知道，常理来说，直接用main.js定义好的就行，但是换成我的做法图片才能渲染出来，往下
在这里插入图片描述
这里我试过很多方法，就这种可以
在这里插入图片描述

Da6668_lei
关注
【前端之旅】uni-app学习笔记
孙不坚1208
08-03 1402
uni-app学习笔记—孙不坚1208 uni-app 官方网页是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多个平台。
uni-app微信小程序：统一接口请求和图片资源路径封装指南
小金子J的博客
05-30 1061
本文介绍了在uni-app微信小程序开发中，如何通过封装统一的接口请求管理和图片访问路径管理来提高开发效率和维护性。通过具体代码示例，展示了如何创建服务地址常量、封装含token的请求函数，以及如何管理不同环境下的图片服务地址。此外，还提供了错误处理和提示信息的统一管理方法，旨在帮助开发者构建更加模块化、易于维护的小程序应用。
uni-app后台数据拿到的图片路径配上域名
Wang_kaiya的博客
01-17 1363
<view class="banner"> <swiper class="swiper" indicator-dots="true" indicator-color="white" indicator-active-color="gray" autoplay="true" interval="2000" circular="true"> <swiper-item class="swiperItem" @click="swiperBtn1" v-for="(
uni-app小程序全局动态引入图片路径方法（小程序分包过大，图片存储到服务器）
最新发布
2302_77005870的博客
08-20 519
XXX/static 服务器上存放图片的根路径，应该与项目开发时图片存储路径保持一致。uni.scss样式文件中使用变量 如下。在main.js中写如下代码。
uniapp微信小程序服务器与行内img src图片路径拼接
Da6668_lei的博客
10-23 4204
uniapp微信小程序服务器与行内img src图片路径拼接 1、在main.js 在行内直接引入 运行就可以连接到服务器的图片了
vue,uniapp封装图片地址拼接函数
qq_47902937的博客
12-26 628
app.vue图片不用修改 原来的css和template（一般来说可以没有template） 只需要修改script。使用方法 （）item.lecture.cover是图片的地址。uniapp的拼接 写在main.js中不用导出可以直接使用。
uniapp本地图片image写成变量模式
qq_43024468的博客
07-05 2450
data(){ imgurl: ‘’ }
【微信小程序高频面试题——精选一】
ytfty24124的博客
11-28 7527
uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可以发布到IOS、Android、Web（响应式）、以及各种小程序、快应用等多个平台。
2024前端面试题！（附答案及解析）（2024.10月最新版）
这世上从不缺让人上头的新鲜感，能顾及你情绪的人实属难得。
03-27 17万+
2024前端面试题！面试宝典！总结心得！（附答案及解析）会持续更新哦！（2024.10月最新版）感谢支持，你们的鼓励是我的动力！
vue2 vue3 js es6 html css 知识点
weixin_71783532的博客
08-03 1049
生命周期函数 又叫钩子函数 是到了某一个时间点会自动触发 我们讨论的是 vue 实例的钩子函数 从 vue 实例创建到销毁的过程中 到了一定的时间节点就会触发是 ECMAScript 的第六个版本 在 es5 的基础上新增加了一些语法 js 分成三部分 dom（文档对象模型） bom（浏览器对象模型） ECMAScript（js 语法）1.JavaScript（以下简称 js）的数据类型分为两种：原始类型（即基本数据类型）和对象类型（即引用数据类型）；...
2022前端知识整理：十、vue基础
weixin_42373976的博客
07-15 993
2022前端知识整理：第十部分、vue基础，仅包含vue2.0相关知识，建议先完成html5、css3和JavaScript ES6之后再学习。部分图片未上传成功，稍后完善，请见谅。
UNIAPP 扫码路径 拼接错误 如何恢复（兼容小程序）
weixin_43952913的博客
11-14 332
UNIAPP 扫码路径 拼接错误 如何恢复（兼容小程序）
uniapp小程序怎么实现合并图片并获取到图片路径
weixin_35755188的博客
12-21 604
您好！可以使用 UniApp 的 canvas 组件来合并图片，具体步骤如下： 在页面的 template 中添加 canvas 组件，并在组件中指定宽度和高度： <template> <viewclass="container"> <canvas ref="canvas" width="600" height="400"></canvas...
【uniapp学习公共图片路径封装及使用】
weixin_38673922的博客
02-03 419
uniapp学习公共图片路径封装及使用
uniapp 开发小程序，封装一个方法，让图片使用线上地址
weixin_48596030的博客
08-29 1246
【代码】uniapp 开发小程序，封装一个方法，让图片使用线上地址。
微信小程序-image(图片)
热门推荐
Ethan_LG的专栏
10-26 23万+
在微信小程序中，要显示一张图片，有两种图片加载方式： 加载本地图片加载网络图片 加载本地图片 src="/image/arrowright.png" 这句就是加载本地图片资源的。想想iOS中的加载本地图片，imageName:,类似。 加载网络图片 微信在加载网络这方面封装的还是很好的，包括语音和视频的加载。直接给'src'这个属性附上地址，它会自动加载。
uniapp 微信小程序 图片动态回显 :src
maoge_666的博客
07-28 1086
uniapp 微信小程序 图片动态回显 :src
uniapp 全局添加图片 oss 或 网站域名 前缀
beyond520lin的博客
04-04 1065
该方法自动判断是否已是远程图片，如果已经是网络上的图片则不会再添加域名，如果是相对路径的图片则会自动添加域名前缀，变成远程图片。在调用的页面调用方法。
UniApp小程序实现微信登录：步骤与全局封装
在使用UniApp开发微信小程序时，实现微信登录功能是一个关键步骤，它允许用户通过微信账号快捷地登录你的应用。以下是一个详细的步骤概述： 1. **微信登录逻辑设计**： - 在`main.js`文件中，首先创建一个公共函数...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值