要实现的效果

在 下面app.json  中加下列代码

 
"tabBar": {
"color": "#7A7E83",
"selectedColor": "#3cc51f",
"borderStyle": "black",
"backgroundColor": "#ffffff",
"list": [
{
"pagePath": "pages/index/index",
"iconPath": "pages/images/icon_API.png",
"selectedIconPath": "pages/images/icon_API_HL.png",
"text": "API"
},
{
"pagePath": "pages/logs/logs",
"iconPath": "pages/images/icon_component.png",
"selectedIconPath": "pages/images/icon_component.png",
"text": "接口"
},
{
"pagePath": "pages/my/my",
"iconPath": "pages/images/icon_component.png",
"selectedIconPath": "pages/images/icon_component.png",
"text": "组件"
}
 
]
}
 
注意  页面路由  index  这个要第一显示否则下面toobar  看不到

小程序 显示Toobar的更多相关文章

  1. 微信小程序显示cms里的html文章

    首先在cms模版中将html文章转化为json数据,识别图片,文本和换行,过滤掉样式和标签.这里是用PHP的正则表达式函数来实现的,$content是cms里的html文章. <?php $_a ...

  2. 微信小程序-显示外链图片 bug

    微信小程序-显示外链图片 bug 显示外链图片 bug 403 bug 禁止外链,未授权 https://httpstatuses.com/403 image component 图片.支持 JPG. ...

  3. 微信小程序显示html格式内容(wxParse使用及循环解析数据渲染)

    小程序默认是不支持html格式的内容显示的,那我们需要显示html内容的时候,就可以通过wxParse来实现. 首先我们下载wxParse,github地址:https://github.com/ic ...

  4. 微信小程序—显示当前时间

    问题:  在页面上显示当前时间(日期) 方法: 1.在util.js (创建项目自动生成)中: // util.js const formatTime = date => { const yea ...

  5. 微信小程序基础入门

    准备 Demo 项目地址 https://github.com/zce/weapp-demo Clone or Download(需准备GIT环境) $ cd path/to/project/root ...

  6. 微信小程序之生命周期(三)

    [未经作者本人同意,请勿以任何形式转载] 上一篇介绍微信小程序开发工具使用和项目目录结构. 这一章节介绍微信小程序的生命周期,什么是生命周期呢? 通俗的讲,生命周期就是指一个对象的生老病死. 从软件的 ...

  7. 微信小程序学习

    官方网站 https://mp.weixin.qq.com/debug/wxadoc/dev/index.html 项目结构介绍 -- MINA框架 https://mp.weixin.qq.com/ ...

  8. 微信小程序注册app

    App() App() 函数用来注册一个小程序.接受一个 object 参数,其指定小程序的生命周期函数等. object参数说明 onLaunch   Function 生命周期函数--监听小程序初 ...

  9. 第一个微信小程序(实现点击一个按钮弹出toast)

    今天根据网上的教程搭建了微信小程序的环境,然后看文档做了一个简单的小应用. 项目的目录是这个样子的: app.js.app.json.app.wxss是全局文件,必不可少的文件.定义在app.wxss ...

随机推荐

  1. Junit单元测试类

    /*package zxdc.web; import static org.junit.Assert.*; import java.io.IOException; import javax.servl ...

  2. 采用Psyco实现python执行速度提高到与编译语言一样的水平

    本文实例讲述了采用Psyco实现python执行速度提高到与编译语言一样的水平的方法,分享给大家供大家参考.具体实现方法如下: 一.安装Psyco很简单,它有两种安装方式,一种是源码方式,一种是二进制 ...

  3. ubuntu 使用命令行清空回收站

    sudo rm -rf ~/.local/share/Trash/*

  4. vue-touchjs

    支持vue2.0的面向指令的touch指令,基于touchjs(原百度实现的移动端手势库) vue-touchjs支持三种stopPropagation的方式: 1 .stop修饰符 2  事件han ...

  5. web缓存概述

    缓存无处不在,所展示出的仅仅是服务器端的缓存,我们从细节层面一层层分析 但是在此之前,我们先要知道什么是缓存与为什么要使用缓存,是时候百度一波喽~ 缓存就是数据交换的缓冲区(称作Cache),当某一硬 ...

  6. bzoj4455

    容斥原理+dp 首先考虑暴力做法,我们希望点和点一对一,那么自然要保存当前点集的状态,需要状压,据说要3^n,那么自然不行 考虑容斥原理,刚才一一对应的限制太强了,我们不要一一对应,只要满足边存在就行 ...

  7. Adventure Works 教程

    多维建模(Adventure Works 教程)     欢迎使用 Analysis Services 教程. 本教程通过在所有示例中使用虚构公司 Adventure Works Cycles,说明如 ...

  8. Linux系统如何查看版本信息?

    查看版本号 我在Ubuntu下做测试 1 命令行执行 cat /etc/issue  (切记cat后要空一格)即可看到版本信息. 2 登录linux,在终端输入 cat /proc/version  ...

  9. 4、css之position

    一.position position属性:指定一个元素(静态的,相对的,绝对或固定)的定位方法的类型. 1.fixed值 fixed值:生成固定定位的元素,相对于浏览器窗口进行定位.元素的位置通过 ...

  10. 3-2带命令行参数的Java

    命令行参数: 主方法Main 小括号里面的内容就是命令参数: String[] args class ArgsDemo{ public static void main(String[] args){ ...