uniapp——第4篇:分析一下全局文件、配置

前提,建议先学会前端几大基础:HTML、CSS、JS、Ajax,还有一定要会Vue!(Vue2\Vue3)都要会!!!不然不好懂

一、uniapp项目创建新包放乱杂文件

我们的项目结构里有一个包叫static,他会把页面的资源都打包编译,包括图片、js文件、css文件......那么如果static里有一些垃圾文件或者大量视频音频,那整体的小程序体积就会变大

uniapp对static的解释:工程简介 | uni-app官网

那么就需要创建于一个新的包(目录/文件夹)用来放各种垃圾或者测试文件,叫啥名都无所谓,但是一般来说都叫【common】

二、引入外部css文件

学习HTML和CSS的时候也知道,有的时候css和html写在一个页面确实挺烦的挺难看的

我们通常会在外部来写css文件,然后导入html文件就行

那么怎么uniapp怎么导入外部css文件?就在你要导入的页面的<style>区域这样:

<style>
    @import "@/你的css文件目录"
</style>

这里注意:1、我们可以把css文件放在common文件夹下

                  2、采用根目录方式获取css文件路径,也就是从项目根目录一直到css文件的目录

                  3、绝不可以漏了"@/",它的意思就是根目录

当然你还可以在css文件去引入外部css文件、在less文件去引入外部less文件、在scss文件去引入外部scss文件,方法是一样的

三、page.json配置页面、小程序窗口、导航栏全局配置

这些是page.json文件的所有配置属性:(来自官方文档pages.json 页面路由 | uni-app官网)

"pages"页面配置

首先,“pages”配置项是把你所有写的pages目录下的页面配置好,配置完了你才能看到你写的页面,排在第一位的是小程序启动的第一个页面

"path":填页面文件的路径

"style":填对应各自页面的头部窗口的样式、顶部大标题......

"globalStyle"顶部窗口配置

然后"globalStyle"是全局的顶部窗口的样式

至于为什么上面图片里globalStyle设置了"navigationBarTitleText"为"uni-app",而窗口显示的是"中国陶瓷历史时间轴"?因为我在"pages"页面配置的时候对它做了局部配置,覆盖了这的全局配置

tabBar导航栏

导航栏就是一直显示在顶部或底部的那一条玩意,点它跳转页面

需要在pages.json里手动添加一个"tabBar"配置项,然后第一个"selectedColor"是指被点击选中时文字的颜色、"list"是就配置的导航栏上每一个页面按钮(最多5个)

"list"里面对应配置每个按钮跳转到那个页面的路径、文字、未点击选中时的图片、点击选中是的图片......(这里给一个免费小图标网址:iconfont-阿里巴巴矢量图标库)

这是官方文档的配置项,自己试吧:

"list"的配置项

四、manifest.json应用配置

manifest.json是应用的配置,类似于“设置”,不用写代码的

就提几点:

在uniapp写的项目转到微信开发者工具,是不能直接上传的,需要回到uniapp的manifest.json找到【微信小程序配置】——>【微信小程序AppID】去把你在微信小程序官网(微信小程序)注册的AppID写上去,注册步骤很简单,自己试一下或者查一下就行了

这里的【上传代码时自动压缩】选上,可以压缩小程序体积,不至于上传时体积过大不给过

然后在【源码视图】这里可以写代码,最下面这几个配置可以了解一下

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/466270.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Python环境下基于1D-CNN、2D-CNN和LSTM的一维信号分类

以简单的西储大学轴承数据集为例&#xff0c;随便你下载几个信号玩耍吧&#xff0c;我选了10个信号&#xff0c;分别求为正常状态&#xff0c;内圈&#xff08;轻、中和重度损伤&#xff09;&#xff0c;外圈&#xff08;轻、中和重度损伤&#xff09;&#xff0c;滚动体&#…

分类预测 | Matlab实现BiTCN双向时间卷积神经网络数据分类预测/故障识别

分类预测 | Matlab实现BiTCN双向时间卷积神经网络数据分类预测/故障识别 目录 分类预测 | Matlab实现BiTCN双向时间卷积神经网络数据分类预测/故障识别分类效果基本描述程序设计参考资料 分类效果 基本描述 1.Matlab实现BiTCN双向时间卷积神经网络数据分类预测/故障识别。 2.自…

4个环节5大方面,助您打造“标准化仓库”

仓库管理&#xff0c;在保障企业物流运作效率、降低运营成本、提高客户服务质量等方面发挥着不可替代的作用。标准化、规范化管理作为仓库管理中的重要手段&#xff0c;不仅能够提高管理效率&#xff0c;还能够有效地降低管理风险&#xff0c;使仓库运作更加安全、稳定、高效。…

弧光保护装置助力煤矿高压开关柜的可靠供电

在煤矿高压开关柜运行中&#xff0c;由于受到多种因素的干扰&#xff0c;中低压母线发生故障的概率较高&#xff0c;在中低压母线装设中又没有设置专门的保护&#xff0c;所以开关柜电弧光短路等问题时有发生&#xff0c;对变压器等设备造成一定的损害。鉴于此&#xff0c;对电…

3.16美团笔试复盘

3.16美团复盘 第一题 题目分析 这一题比较简单&#xff0c;直接模拟即可&#xff0c;sum(a)-t1-t2; import java.util.*; class Main{public static void main(String[] args){Scanner scnew Scanner(System.in);int nsc.nextInt();long sum0;while(n-->0){sumsc.nextInt()…

宜搭生产情况调试技巧

在宜搭生产环境中&#xff0c;经常会碰到一些人对于某些操作有报错&#xff0c;即便是有错误日志&#xff0c;但是错误日志没发获取详细的错误栈和错误信息,因此对于复刻某些操作是有必要的&#xff0c;这里我给出一个还蛮好用的方法。 首先找到错误操作的数据来源&#xff0c…

盛元广通全新智能实验室管理系统3.0强势上线

目前&#xff0c;盛元广通全新上线智能实验室管理系统3.0&#xff0c; 在原有的产品基础上迭代更新升级&#xff0c;此次升级以“新势能、智能化、低代码化”为产品功能赋能&#xff0c;从界面的整体布局、数据的维度、和兼容、安全性方面都实现了质的提升&#xff0c;系统在易…

代码随想录算法训练营第14天 part01 | 二叉树理论基础篇

代码随想录 二叉树理论基础篇 二叉树的种类 二叉树有两种主要的形式&#xff1a;满二叉树和完全二叉树 满二叉树&#xff1a;如果一棵二叉树只有度为0的结点和度为2的结点&#xff0c;并且度为0的结点在同一层上&#xff0c;则这棵二叉树为满二叉树。 这棵二叉树为满二叉树…

2023年迟到的年终总结

前言 一年又一年&#xff0c;过的好快啊。本以为上一年是黑云压城城欲摧&#xff0c;2023年可以甲光向日金鳞开&#xff0c;但是没想到23年更是黑暗啊&#xff0c;人生嘛总是十之八九不如意&#xff0c;一年的经历可以大概的概括为&#xff0c;业务转型的Q1&#xff0c;压力倍增…

悲观锁(Pessimistic Locking)是一种数据库锁定机制

悲观锁&#xff08;Pessimistic Locking&#xff09;是一种数据库锁定机制&#xff0c;用于防止多个事务同时修改同一数据记录。以下是关于悲观锁的一些详细信息&#xff1a; 锁定数据&#xff1a;当事务对一条记录进行操作时&#xff0c;悲观锁会阻止其他事务对这条记录进行修…

2024年全新的抖店电商创业玩法,一个月多赚大几千!实操教程在这

大家好&#xff0c;我是电商花花。 新一年&#xff0c;新征程&#xff0c;一些打工人回到自己的岗位上做着按部就班的工作。 然后也有一些创业的朋友就开始寻找着2024年的赚钱新机会和新风口。 作为在电商创业将近8年的我&#xff0c;预测2024年的风口依然是电商渠道&#x…

【Redis】基于Redis实现共享Session登录

用户登录是一种常用功能。这里记录一下基于Redis实现用户登录的代码。  下面是登录的流程图&#xff1a; 用户先提交手机号和验证码&#xff0c;服务器以手机号为key校验redis中存储的验证码&#xff0c;存在&#xff0c;则查询数据库中是否存在用户&#xff0c;不存在则创建…

【Quixel Mixer】简单介绍

一、下载 官网下载地址&#xff1a;Quixel Mixer - All-in-one texturing & material creation tool 下载好之后双击exe来安装 等待安装完成 下载后打开&#xff0c;新建一个工程和Mix 二、界面介绍 我们先将软件界面分为如下3个部分 1号区域为菜单栏 2号区域介绍 2号…

Windows Docker 安装

Docker 并非是一个通用的容器工具&#xff0c;它依赖于已存在并运行的 Linux 内核环境。 Docker 实质上是在已经运行的 Linux 下制造了一个隔离的文件环境&#xff0c;因此它执行的效率几乎等同于所部署的 Linux 主机。 因此&#xff0c;Docker 必须部署在 Linux 内核的系统上…

Linux —— 定时任务(sleep、crontab、at)

目录 1、使用 sleep 来完成定时任务 2、使用 crontab 来进行定时任务 3、使用 at 来执行单次的定时任务 1、使用 sleep 来完成定时任务 sleep n 等待 n 秒再继续往后执行 usleep n 等待 n 微秒再继续往后执行&#xff08;1 秒等于 1 000 000 微秒&#xf…

聚道云如何实现薪人薪事与金蝶云无缝对接,破解财务难题?

一、客户介绍 某科技有限责任公司是一家在信息技术领域具有显著影响力的企业&#xff0c;长期致力于为企业提供全面的解决方案和技术支持。在业务范围上&#xff0c;该公司覆盖了多个关键领域&#xff0c;包括云计算、大数据、人工智能等前沿技术。公司不仅提供定制化的技术解…

从资金管理的角度谈谈个人怎样交易现货白银

刚进入现货白银市场&#xff0c;个人要怎么交易现货白银的&#xff1f;这就涉及现货白银交易生涯的开启问题&#xff0c;开头开的好&#xff0c;我们整个交易生涯都将会有所裨益&#xff0c;所以我们要为个人怎样交易现货白银开个好头。下面我们就从资金管理的角度出发&#xf…

可视化搭建一个智慧零售订单平台

前言 智慧零售行业是在数字化浪潮中快速发展的一个领域&#xff0c;它利用先进的信息技术和大数据分析来提升零售业务的效率和顾客体验。智慧零售订单平台&#xff0c;具有跨平台、数据智能清洗和建模&#xff0c;以及更加丰富的数据展示形式等优势。智慧零售订单平台可以以文…

1.gradle编译和运行

1.在Windows 项目的根目录下使用.\gradlew.bat build命令进行编译。 如果出错的原因是连接超时&#xff1a; Exception in thread “main” java.io.IOException: Downloading from https://services.gradle.org/distributions/gradle-8.6-bin.zip failed: timeout (10000ms) a…

薄板/厚板模态分析Matlab有限元编程 | 【源码+理论文本】|板单元|板壳单元|Mindlin Reissner

专栏导读 作者简介&#xff1a;工学博士&#xff0c;高级工程师&#xff0c;专注于工业软件算法研究本文已收录于专栏&#xff1a;《有限元编程从入门到精通》本专栏旨在提供 1.以案例的形式讲解各类有限元问题的程序实现&#xff0c;并提供所有案例完整源码&#xff1b;2.单元…