网络知识 娱乐 你会微信小程序自定义底部导航栏吗?

你会微信小程序自定义底部导航栏吗?

一、 在目录下创建文件如下图:


tabbar.js:
// pages/tabbar/tabbar.js
const app = getApp();
Component({
/**

  • 组件的属性列表
    */
    properties: {
    tabbar: {
    type: Object,
    value: {
    “backgroundColor”: “#ffffff”,
    “color”: “#333”,
    “selectedColor”: “#fca89d”,
    “borderStyle”: “white”,
    “list”: [{
    “pagePath”: “/pages/index/index”,
    “text”: “首页”,
    “iconPath”: “http://192.168.2.61/wap/rm/images/in.png”,
    “selectedIconPath”: “http://192.168.2.61/wap/rm/images/ined.png”
    },
    {
    “pagePath”: “/pages/mry/mry”,
    “text”: “美容院”,
    “iconPath”: “http://192.168.2.61/wap/rm/images/mei.png”,
    “selectedIconPath”: “http://192.168.2.61/wap/rm/images/meied.png”
    },
    {
    “pagePath”: “/pages/shop/shop”,
    “text”: “商城”,
    “iconPath”: “http://192.168.2.61/wap/rm/images/shop.png”,
    “selectedIconPath”: “http://192.168.2.61/wap/rm/images/shoped.png”
    },
    {
    “pagePath”: “/pages/mine/mine”,
    “text”: “我的”,
    “iconPath”: “http://192.168.2.61/wap/rm/images/min.png”,
    “selectedIconPath”: “http://192.168.2.61/wap/rm/images/mined.png”
    }
    ],
  • }
    }
    },

/**



。。。。。。。。。。。。。

作者:Vam的金豆之路

篇幅有限更多请见扩展链接:http://www.mark-to-win.com/tutorial/50998.html