⼩程序--icon引⼊外部图标
本博客仅仅只是个意外。⼤佬请绕道。
第⼀步：搭建框架
⾸先你得有个⼩程序的开发⼯具，然后把⼩⽩架构搭建好。（不会去看）。
简单的初步框架搭建完之后⽬录和界⾯是这个样⼦：
如果想加⼀个底部tab框，只需要在pages⽬录下新建个⽬录，然后在新建个pages就OK了。创建好之后再app.js⾥会⾃动加⼊此⽬录，但是不会显⽰底部tab框。这⾥就要看官⽹的tabBar如何说明的了，只需
要改下app.js，代码：
{
"pages": [
"pages/index/index",
"pages/logs/logs",
"pages/icon/icon"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#ccc",
"navigationBarTitleText": "⼩程序",
"navigationBarTextStyle": "black"
},
textstyle"tabBar": {
"list": [
{
"pagePath": "pages/index/index",
"text": "⾸页"
},
{
"pagePath": "pages/icon/icon",
"text": "图标"
}
]
},
"style": "v2",
"sitemapLocation": "sitemap.json"
}
编译并进⼊图标：
第⼆步：下载图标并引⼊
进⼊，登录后选中你想要的图标加⼊到购物车，选完之后点击购物车，选择下载代码。
下载出来的是⼀个zip压缩包，解压之后就可以看到如下⽬录：
这时，我们只需要iconfont.css⽂件就可以了，打开此⽂件，把所有代码复制到app.wcss⽂件中
到这⾥就已经完成⼤部分⼯作了。
接下来就可以修改icon.wxml⽂件了，代码如下：
<view>
<icon class="iconfont icon-add-cart"></icon>
<text>：这⾥是icon后⾯的⽂字</text>
</view>
结果;
rpx，结果展⽰：

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。