原生小程序--引入字体图标和搭建tabbar

引入字体图标

1. 在项目根目录 / styles / iconfont.wxss

省略...

2. 在app.wxss中引入

@import "./styles/iconfont.wxss";

3. 在页面中使用

搭建tabbar结构

在app.json文件中，与 window平级

注意：tabbar里面的pagePath路径，必须首先存在于 pages里面才可以！！！

  "pages": [
    "pages/index/index",
    "pages/demo/demo",
    "pages/search/search",
    "pages/category/category",
    "pages/goods_lsit/goods_lsit",
    "pages/goods_detail/goods_detail",
    "pages/cart/cart",
    "pages/collect/collect", 
    "pages/order/order",
    "pages/user/user",
    "pages/feedback/feedback",
    "pages/login/login",
    "pages/auth/auth",
    "pages/pay/pay"    
  ],
 "tabBar": {
    "color": "#666666",
    "selectedColor": "#d43c43",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath": "/assets/icons/home.png",
        "selectedIconPath": "/assets/icons/home-active.png"
      },
      {
        "pagePath": "pages/category/category",
        "text": "分类",
        "iconPath": "/assets/icons/cates.png",
        "selectedIconPath": "/assets/icons/cates-active.png"
      },
      {
        "pagePath": "pages/cart/cart",
        "text": "购物车",
        "iconPath": "/assets/icons/cart.png",
        "selectedIconPath": "/assets/icons/cart-active.png"
      },
      {
        "pagePath": "pages/user/user",
        "text": "我的",
        "iconPath": "/assets/icons/my.png",
        "selectedIconPath": "/assets/icons/my-active.png"
      }
    ],
    "position": "bottom"
  }