深入解析微信小程序开发中遇到的几个小问题


Posted in Javascript onJuly 11, 2020

本地图片不显示,开发工具运行是没问题的,但真机调试却显示不了

item.img = '/goods/img/图片.png'
<image src="
{
{
item.img
}
}
" class="image">
</image>

经过仔细观察发现,路径是没问题的,问题在于图片名不能是中文的,把它改成字母+数字就好了。

使用FileSystemManager.readdir(Object object)方法读取本地文件夹中的所有图片,报错'readdir:fail no such file or directory'

dirPath = '/goods/img'
同样在开发工具上运行是没问题的,但真机调试就报错了。
问题所在:将dirPath设成'/',读取该文件夹下的所有文件名后得:

0: "app-service.js"
1: "app-config.json"
2: "app-service.js.map"
3: "page-frame.html"

真机调试时,readdir方法的根目录并不是项目的根目录

解决方案:暂无好的解决方法。(暂时用暴力法解决了:直接存下所有图片的名称,读取后再分割拼接路径。imgNames = '0.png,1.png,2.png'

在js里读取其它json文件的内容

短时间内没找到读取方法,因此用了替代方案:
将数据存在js文件里,设为一个变量,再用require方法来引用这个js文件。

let list = [
 {
  "id": "1",
  "name": "测试产品名字",
  "category": "分类1",
  "price": "123.5",
  "description": "产品的简单介绍",
  "img": "0.png",
 },
 {
  "id": "2",
  "name": "测试产品名字2",
  "category": "分类2",
  "price": "125.5",
  "description": "产品的简单介绍",
  "img": "1.png,2.png,3.png,4.png",
 },
 ...
]
module.exports = {
 goodsList: list
}
let goodsInfo = require('../../goods/info.js');
let list = goodsInfo.goodsList
for(let goods of list){
  console.log(goods)
}

总结

到此这篇关于微信小程序开发中遇到的几个小问题的文章就介绍到这了,更多相关小程序开发小问题内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jquery 锁定弹出层实现代码
Feb 23 Javascript
基于jQuery的遍历同id元素 并响应事件的代码
Jun 14 Javascript
JavaScript中双叹号(!!)作用示例介绍
Apr 10 Javascript
JavaScript如何实现跨域请求
Aug 05 Javascript
AngularJS入门教程之MVC架构实例分析
Nov 01 Javascript
ajax 提交数据到后台jsp页面及页面跳转问题
Jan 19 Javascript
如何在Angular2中使用jQuery及其插件的方法
Feb 09 Javascript
jQuery Chosen通用初始化
Mar 07 Javascript
Django+Vue.js搭建前后端分离项目的示例
Aug 07 Javascript
Vuex提升学习篇
Jan 11 Javascript
JS 数组随机洗牌的实例代码
Sep 12 Javascript
微信小程序实现抖音播放效果的实例代码
Apr 11 Javascript
微信小程序上传帖子的实例代码(含有文字图片的微信验证)
Jul 11 #Javascript
详解JavaScript匿名函数和闭包
Jul 10 #Javascript
Vue watch响应数据实现方法解析
Jul 10 #Javascript
详解Vue之事件处理
Jul 10 #Javascript
jQuery开发仿QQ版音乐播放器
Jul 10 #jQuery
Element图表初始大小及窗口自适应实现
Jul 10 #Javascript
Vue路由切换页面不更新问题解决方案
Jul 10 #Javascript
You might like
一个MYSQL操作类
2006/11/16 PHP
简单解决新浪SAE无法上传文件的问题
2015/05/13 PHP
php调用淘宝开放API实现根据卖家昵称获取卖家店铺ID的方法
2015/07/29 PHP
WordPress中用于检索模版的相关PHP函数使用解析
2015/12/15 PHP
删除PHP数组中头部、尾部、任意元素的实现代码
2017/04/10 PHP
Nginx下ThinkPHP5的配置方法详解
2017/08/01 PHP
检测是否已安装 .NET Framework 3.5的js脚本
2009/02/14 Javascript
Extjs学习笔记之七 布局
2010/01/08 Javascript
通过jquery还原含有rowspan、colspan的table的实现方法
2012/02/10 Javascript
JavaScript自执行闭包的小例子
2013/06/29 Javascript
jquery属性选择器not has怎么写 行悬停高亮显示
2013/11/13 Javascript
JavaScript实现判断图片是否加载完成的3种方法整理
2015/03/13 Javascript
Bootstrap每天必学之滚动监听
2016/03/16 Javascript
简单了解JavaScript操作XPath的一些基本方法
2016/06/03 Javascript
详解XMLHttpRequest(二)响应属性、二进制数据、监测上传下载进度
2016/09/14 Javascript
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
2017/04/14 jQuery
Vue 多层组件嵌套二种实现方式(测试实例)
2017/09/08 Javascript
关于微信小程序登录的那些事
2019/01/08 Javascript
vue 如何从单页应用改造成多页应用
2020/10/23 Javascript
[01:09:50]VP vs Pain 2018国际邀请赛小组赛BO2 第二场
2018/08/20 DOTA
Python中字符串的修改及传参详解
2016/11/30 Python
python远程连接服务器MySQL数据库
2018/07/02 Python
Python 绘制可视化折线图
2020/07/22 Python
Pytest如何使用skip跳过执行测试
2020/08/13 Python
Python生成pdf目录书签的实例方法
2020/10/29 Python
plt.figure()参数使用详解及运行演示
2021/01/08 Python
深入解析HTML5中的Blob对象的使用
2015/09/08 HTML / CSS
html5使用window.postMessage进行跨域实现数据交互的一次实战
2021/02/24 HTML / CSS
优秀的茶餐厅创业计划书
2014/01/03 职场文书
心理咨询承诺书
2014/05/20 职场文书
2014年教师党员公开承诺书
2014/05/28 职场文书
政府采购方案
2014/06/12 职场文书
青年文明号申报材料
2014/12/23 职场文书
导游词之山东八大关
2019/12/18 职场文书
HTML+JS实现在线朗读器
2022/02/15 Javascript
mysql查询结果实现多列拼接查询
2022/04/03 MySQL