首页 > 移动平台 > 详细

01uni-app的创建 运行在不同端上的配置 tarBar的配置

时间:2020-01-04 22:01:44      阅读:117      评论:0      收藏:0      [点我收藏+]

uni-app的创建

01==>创建uni-app的项目非常简单。不需要注意什么注意点哈!!
创建项目的时候  可以参考官网
https://uniapp.dcloud.io/quickstart
在使用uni-app的时候,你要创建下载huildex  和微信小程序开发者工具
在你使用HUilderX编译的过程中第一次大概需要五分钟


02==》运行uni-app
在浏览器中可以直接运行H5版本


03==》如何运行到小程序上
配置小程序运行的路径
我的是    E:\开发工具\xiaocehngxu_soft\微信web开发者工具
如何你配置好了之后,小程序开发工具打开失败。
在微信开发工具中===》设置==》安全设置===》开启服务端口  就可以正常开启了

03-1==》在打开微信小程序后,如何设置自己的appId呢??
在【工具】===》【开发详情】====》修改   默认的appId


04==>  在pages.json中去配置 小程序顶部的标题 颜色  和字体等哈  这个文件pages.json是专门处理小程序的


05===》如何新创建一个页面呢
新建目录==》about==>在创建一个about.vue文件
然后去在pages.json中去配置   配置路径  顶部的样似等
{
            "path": "pages/about/about",
            "style": {
                "navigationBarTextStyle": "black",
                "navigationBarTitleText": "about",
                "navigationBarBackgroundColor": "hotpink",
                "backgroundColor": "#F8F8F8"
            }
},

如何配置tarBar


06==>如何配置tabBar
对于tabBar的配置  跟在小程序上是一样的哈
selectedIconPath  是选中的时候的图片
iconPath是默认的时候的图片
 
"tabBar": {
      "list": [
        { 
          "selectedIconPath":"./static/home_active.png",
          "iconPath":"./static/home.png",
          "pagePath": "pages/index/index",
          "text": "首页"
        },
        {
          "selectedIconPath": "./static/category_active.png",
          "iconPath": "./static/category.png", 
          "pagePath": "pages/about/about",
          "text": "动态"
        },
、
        {
          "selectedIconPath": "./static/profile_active.png",
          "iconPath": "./static/profile.png",
          "pagePath": "pages/person/person",
          "text": "我的"
        }
      ]
  },

技术分享图片

01uni-app的创建 运行在不同端上的配置 tarBar的配置

原文:https://www.cnblogs.com/IwishIcould/p/12150361.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!