本文共 680 字，大约阅读时间需要 2 分钟。

设置页面基础配置和tabbar

创建相关页面

1. 页面详情（全部页面的第二个斜杠后面可为index）

2. 快速编辑参考列式编程技巧，

   多光标编辑：alt+鼠标左键

   光标向下选择编辑列：alt+shift+down (向上选择按up)

   同时向后选择一个单词：ctrl+shift+left (向右选择按right)

   向下复制一行代码：alt+shift+down (向上复制按up)

   

引入字体库（可省略）

1. 在字体库网站上选择好所要使用的图标，加入项目中

2. 获取css代码（https://www.iconfont.cn/）

   

3. 在项目中的style文件夹中创建iconfont.wxss，将浏览器访问中的代码加入到此文件中

4. 在app.wxss中引入iconfont.wxss （相对路劲）

   @import "./style/iconfont.wxss"

初始化全局组件样式

themeColor为自定义样式名

@import "./style/iconfont.wxss";page,view,text,swiper,swiper-item{
     padding:0;  margin:0;  box-sizing: border-box;}page{
     --themeColor: #47B5FF;  font-size: 28rpx;}

设置tabbar

1. 在项目根目录下引入要使用的图片，然后将路径写在iconPath和selecticonPath处。tabbar图片必须放在项目中，放在云存储中引用不了。
   
2. 效果如下 ，这里的图标是在阿里的字体库网站上找的。

转载地址：http://zkhgn.baihongyu.com/