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


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 相关文章推荐
js判断浏览器的比较全的代码
Feb 13 Javascript
基于jQuery的计算文本框字数的代码
Jun 06 Javascript
当滚动条滚动到页面底部自动加载增加内容的js代码
May 13 Javascript
jQuery中用dom操作替代正则表达式
Dec 29 Javascript
7个有用的jQuery代码片段分享
May 19 Javascript
jquery实现数字输入框
Feb 22 Javascript
bootstrap fileinput组件整合Springmvc上传图片到本地磁盘
May 11 Javascript
vue实现鼠标移入移出事件代码实例
Mar 27 Javascript
微信小程序实现购物车代码实例详解
Aug 29 Javascript
JS实现基本的网页计算器功能示例
Jan 16 Javascript
关于AngularJS中几种Providers的区别总结
May 17 Javascript
JavaScript实现点击切换功能
Jan 27 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
PHP 函数学习简单小结
2010/07/08 PHP
PHP实现根据数组某个键值大小进行排序的方法
2018/03/13 PHP
Laravel 将数据表的数据导出,并生成seeds种子文件的方法
2019/10/09 PHP
javascript 对象比较实现代码
2009/04/27 Javascript
JavaScrip单线程引擎工作原理分析
2010/09/04 Javascript
JavaScript的漂亮的代码片段
2013/06/05 Javascript
Extjs NumberField后面加单位实现思路
2013/07/30 Javascript
按Enter键触发事件的jquery方法实现代码
2014/02/17 Javascript
判断浏览器的内核及版本号方法汇总
2015/01/05 Javascript
javascript实现控制的多级下拉菜单
2015/07/05 Javascript
单行 JS 实现移动端金钱格式的输入规则
2017/05/22 Javascript
react.js组件实现拖拽复制和可排序的示例代码
2018/08/20 Javascript
vue实现的组件兄弟间通信功能示例
2018/12/04 Javascript
详解nodejs 配置文件处理方案
2019/01/02 NodeJs
小程序开发中如何使用async-await并封装公共异步请求的方法
2019/01/20 Javascript
JS隐藏号码中间4位代码实例
2019/04/09 Javascript
vue之组件内监控$store中定义变量的变化详解
2019/11/08 Javascript
Python写的Discuz7.2版faq.php注入漏洞工具
2014/08/06 Python
Python内置函数Type()函数一个有趣的用法
2015/02/18 Python
Python使用xlrd读取Excel格式文件的方法
2015/03/10 Python
Python文件操作之合并文本文件内容示例代码
2017/09/19 Python
Python3的介绍、安装和命令行的认识(推荐)
2018/10/20 Python
Mac下Anaconda的安装和使用教程
2018/11/29 Python
python获取磁盘号下盘符步骤详解
2019/06/19 Python
Python打印不合法的文件名
2020/07/31 Python
泰国在线书店:SE-ED
2020/06/21 全球购物
医学类个人求职信范文
2014/02/05 职场文书
煤矿安全生产月活动总结
2014/07/05 职场文书
教师查摆问题及整改措施
2014/10/11 职场文书
租房协议书范例
2014/10/14 职场文书
教师节简报
2015/07/20 职场文书
公司酒会致辞
2015/07/30 职场文书
高中军训感想
2015/08/07 职场文书
redis实现排行榜功能
2021/05/24 Redis
入门学习Go的基本语法
2021/07/07 Golang
如何基于python实现单目三维重建详解
2022/06/25 Python