一、操作步骤
https://github.com/wechat-miniprogram/weui-miniprogram
将WeUI下载后,将weui-wxss-master/dist/路径下的style文件夹复制粘贴到微信小程序的新建项目里
再将WeUI的tabbarde的wxml,wxss,js源代码分别复制粘贴到微信小程序的新建项目pages/index/路径下对应的index.wxml,index.wxss,index.js里面
然后在app.wxss中 @import 'style/weui.wxss‘,
然后编译,刷新
二、出现问题
1.编译后出现的tabbar(底部导航条)文字(微信,通讯录,发现,我)和右上角的红色带圈数字和小红点都和WeUI,但是文字(微信,通讯录,发现,我)上方的icon(图标)没有出现是什么原因?
2.调试器报错内容如下:
VM1571:1 Failed to load local image resource /pages/images/icon_tabbar.png
the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)
console.error @ VM1571:1
(anonymous) @ VM1596:2
3截图如下:
左下角的tabbar文字(微信,通讯录,发现,我)上方的icon(图标)缺失是什么原因?
请指点迷津
对应路径下放图片还是报错
什么原因呢
对应路径下放图片
这是一套基于样式库weui-wxss开发的小程序扩展组件库,同微信原生视觉体验一致的UI组件库,由微信官方设计团队和小程序团队为微信小程序量身设计,令用户的使用感知更加统一。引入WeUI的目的就是为了统一UI效果,难道我还需要自己去找几张icon(图片)?
WeUI的tabbar的效果图里面icon(图标)
如下图:
请问这个每个文字上面的icon(图标)是怎么通过WeUI实现的?