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

简介: 01uni-app的创建运行在不同端上的配置 以及tarBar的配置

uni-app的创建###


01==>


创建uni-app的项目非常简单。不需要注意什么注意点哈!!


创建项目的时候  可以参考官网


https://uniapp.dcloud.io/quickstart


在使用uni-app的时候,你要创建下载huildex  和微信小程序开发者工具


在你使用HUilderX编译的过程中第一次大概需要五分钟


小程序模拟器无法预览


有些时候,


uni-app编译好了之后,


在小程序上无法点击预览(预览按钮无法点击)


此时你需要在HX上小程序上配置自己的appId


02==》


运行uni-app


在浏览器中可以直接运行H5版本


03==》


如何运行到小程序上


配置小程序运行的路径


我的是    E:\开发工具\xiaocehngxu_soft\微信web开发者工具


如何你配置好了之后,小程序开发工具打开失败。


在微信开发工具中===》设置==》安全设置===》开启服务端口  就可以正常开启了


03-1==》在打开微信小程序后,如何设置自己的appId呢??


在【工具】===》【开发详情】====》修改   默认的appId


xxx=>如何在支付宝小程序开发者工具预览了


如果uni-app开发阿里系小程序;下载开发工具;地址: https://ding-doc.dingtalk.com/doc#/kn6zg7/zunrdk


安装过程很简单,没有过多的步骤;


然后在HX配置一下安装的路径,我觉得这一步不配置也行(针对支付宝小程序和钉钉)

因为配置了后也无法去启动;


他会提示 等待支付宝小程序开发者工具启动后,在支付宝小程序开发者工具中打开:


[C:\xxx\unpackage\dist\dev\mp-alipay,然后在HBuilderX中修改文件并保存,会自动刷新支付宝小程序开发者工具]


那么怎么去启动(在你下载的工具中打开 XXX/XXX/unpackage\dist\dev\mp-alipay)


就是说利用支付宝工具去打开HX编译好的代码;这样就可以在支付宝小程序开发者工具中预览了。


(ps==>还是配置一下支付宝小程序开发者工具的地址)


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": "我的"
        }
      ]
  },


1425695-20200104204757311-1800860152.png

相关文章
|
3月前
|
域名解析 网络协议 API
【Azure Container App】配置容器应用的缩放规则 Managed Identity 连接中国区 Azure Service Bus 问题
本文介绍了在 Azure Container Apps 中配置基于自定义 Azure Service Bus 的自动缩放规则时,因未指定云环境导致的域名解析错误问题。解决方案是在扩展规则中添加 `cloud=AzureChinaCloud` 参数,以适配中国区 Azure 环境。内容涵盖问题描述、原因分析、解决方法及配置示例,适用于使用 KEDA 实现事件驱动自动缩放的场景。
|
6月前
|
人工智能 JSON 小程序
【一步步开发AI运动APP】七、自定义姿态动作识别检测——之规则配置检测
本文介绍了如何通过【一步步开发AI运动APP】系列博文,利用自定义姿态识别检测技术开发高性能的AI运动应用。核心内容包括:1) 自定义姿态识别检测,满足人像入镜、动作开始/停止等需求;2) Pose-Calc引擎详解,支持角度匹配、逻辑运算等多种人体分析规则;3) 姿态检测规则编写与执行方法;4) 完整示例展示左右手平举姿态检测。通过这些技术,开发者可轻松实现定制化运动分析功能。
|
3月前
|
存储 Android开发 数据安全/隐私保护
Thanox安卓系统增加工具下载,管理、阻止、限制后台每个APP运行情况
Thanox是一款Android系统管理工具,专注于权限、后台启动及运行管理。支持应用冻结、系统优化、UI自定义和模块管理,基于Xposed框架开发,安全可靠且开源免费,兼容Android 6.0及以上版本。
208 4
|
8月前
|
机器学习/深度学习 存储 人工智能
MNN-LLM App:在手机上离线运行大模型,阿里巴巴开源基于 MNN-LLM 框架开发的手机 AI 助手应用
MNN-LLM App 是阿里巴巴基于 MNN-LLM 框架开发的 Android 应用,支持多模态交互、多种主流模型选择、离线运行及性能优化。
5537 80
MNN-LLM App:在手机上离线运行大模型,阿里巴巴开源基于 MNN-LLM 框架开发的手机 AI 助手应用
|
4月前
《仿盒马》app开发技术分享-- 首页活动配置(5)
上一篇文章中我们实现了项目端云一体化首页部分模块动态配置,实现了对模块模块的后端控制显示和隐藏,这能让我们的app更加的灵活,也能应对更多的情况。现在我们来对配置模块进行完善,除了已有的模块以外,我们还有一些banner ,活动入口等模块,这些模块的数据并不多,所以我们也归纳到配置中去实现。并且我们在配置表中添加了一些不同的id,我们只需要根据相对应的id 去查询对应的表就可以了
80 0
|
7月前
|
Swift iOS开发 开发者
苹果app上架-ios上架苹果商店app store 之苹果支付In - App Purchase内购配置-优雅草卓伊凡
苹果app上架-ios上架苹果商店app store 之苹果支付In - App Purchase内购配置-优雅草卓伊凡
744 13
苹果app上架-ios上架苹果商店app store 之苹果支付In - App Purchase内购配置-优雅草卓伊凡
|
7月前
|
安全 算法 小程序
【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
409 28
【03】微信支付商户申请下户到配置完整流程-微信开放平台创建APP应用-填写上传基础资料-生成安卓证书-获取Apk签名-申请+配置完整流程-优雅草卓伊凡
|
6月前
|
存储 监控 API
【Azure App Service】分享使用Python Code获取App Service的服务器日志记录管理配置信息
本文介绍了如何通过Python代码获取App Service中“Web服务器日志记录”的配置状态。借助`azure-mgmt-web` SDK,可通过初始化`WebSiteManagementClient`对象、调用`get_configuration`方法来查看`http_logging_enabled`的值,从而判断日志记录是否启用及存储方式(关闭、存储或文件系统)。示例代码详细展示了实现步骤,并附有执行结果与官方文档参考链接,帮助开发者快速定位和解决问题。
173 23
|
7月前
|
小程序
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡
474 1
【04】微信支付商户申请下户到配置完整流程-微信开放平台移动APP应用通过-微信商户继续申请-微信开户函-视频声明-以及对公打款验证-申请+配置完整流程-优雅草卓伊凡

热门文章

最新文章