微信小程序四(全局配置和页面配置页面跳转)

全局配置:

         小程序根目录下的 app.json 文件用来对微信小程序进行全局配置,决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等

         tabBar设置:最少两个最多5个

"tabBar": {"list":[{"pagePath": "pages/04/04","text": "04页面"},{"pagePath": "pages/03/03","text": "03页面"},{"pagePath": "pages/02/02","text": "02页面"},{"pagePath": "pages/01/01","text": "01页面"}]}

 

           改变头部样式

              开始的样式:

        

             将背景颜色改成黑色,字体颜色改成白色,标题改成微信

 "window": {"navigationBarTextStyle": "white","navigationBarTitleText": "微信","navigationBarBackgroundColor": "#000"},

navigationBarTextStyle:标题字体颜色,只支持两种颜色,黑色(black)和白色(white),默认为黑色

navigationBarTitleText:标题,任意修改

navigationBarBackgroundColor:背景颜色,只支持16进制设置颜色

       修改后:

       常用的属性:

enablePullDownRefresh:是否开启全局下拉,默认为false不下拉,true为下拉

 页面配置:在页面的json文件中配置样式

       将背景颜色改成#AA0000这种颜色,字体颜色改成白色,标题改成当前其他

       开始样式:

     

      改变后样式:

"navigationBarBackgroundColor": "#AA0000","navigationBarTitleText": "页面配置"

      当全局配置和页面配置中有相同的配置,以页面配置为主,也就是页面配置优先级大于全局配置

     跳转页面:

        第一种方式:wxml页面使用navigator标签

      

<navigator url="/pages/index/index" open-type="navigate">标签普通页面跳转</navigator>

url:当前小程序内的跳转链接

open-type:设置跳转普通页面还是tabBar页面,默认值为navigate,跳转普通页面,值为switchTab,跳转tabBar页面

    第二种方式:js页面书写代码

          普通页面跳转:定义一个方法

 

putong(){wx.navigateTo({url:"/pages/index/index"})}

        wxml页面点击跳转

<button bindtap="putong">页面跳转</button>

        tabBar页面跳转:也是定义一个方法

 

 tarBar(){wx.switchTab({url:"/pages/01/01"})}

      wxml页面点击跳转

<button bindtap="tarBar">tarBar页面跳转</button>

        

 

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

“饕餮之路:贪吃蛇编程精粹“

目录 前言 1.写代码前的预准备 1.1修改控制台 1.2相关WinAPI32知识学习 1.2.1WinAPI32介绍 1.2.2 mode 命令 1.2.3 title 命令 1.2.4COORD 1.2.5GetStdHandle 1.2.6对控制台光标进行设置 1.2.6.1GetConsolrCursorInfo 1.2.6.2 CONSOLE_CURSOR_INFO 1.2.6.3SetConsol…

vos3000外呼系统客户端无法安装如何解决?

如果 VOS3000 外呼系统客户端无法安装&#xff0c;可以尝试以下解决方法&#xff1a; 检查系统要求&#xff1a; 确保你的计算机满足 VOS3000 外呼系统客户端的系统要求&#xff0c;包括操作系统版本、内存、处理器等。如果系统不符合要求&#xff0c;可能会导致安装失败或者运…

c语言中,数组取地址的书写格式

数组取地址 为了更好的区分数组取地址时的情况&#xff0c;我们建立两个数组&#xff0c;arr1一维数组和arr2二维数组&#xff0c;用printf函数来打印出每个例子arr1和arr2的地址&#xff0c;这样可以更加直观的区分出来。 首先我们看到第一组打印&#xff0c;可以看到若是直接…

Qt图片等资源管理

Qt的图片等资源管理通常有两种方式 1&#xff0c;直接将图标和一些配置文件打包在可执行程序中 添加qrc文件&#xff0c;可使用qtcreator直接添加 右键选中工程 点击选择即可。 然后添加文件。我这个例子是添加了Image文件夹下的图片资源 使用的时候&#xff0c;可以在代码…

TCP/IP协议(二)

一、TCP-选项 1.简介 在TCP/IP报文中&#xff0c;固定头部下边就是 "选项"部分。 (1)TCP头部的选项部分是TCP为了适应复杂的网络环境和更好的服务应用层而进行设计的 (2)大多数的TCP选项部分出现在TCP连接建立阶段 2.构成 2.1 最大报文传输段 最大报文传输段(Ma…

Java面试八股之简述Servlet体系结构

简述Servlet体系结构 Servlet是Java Web开发中的核心组件&#xff0c;用于接收和响应HTTP请求&#xff0c;生成动态内容。它具有平台无关性、协议无关性和动态内容生成能力&#xff0c;遵循明确的生命周期。尽管现代Web开发中更多使用高级框架&#xff0c;但Servlet作为基础&a…

【SAP ME 18】SAP ME创建开发组件ear

1、说明 SC开发组件ear项目是所有sap me二次开发项目的编译入和部署入口,通过ear可以有效的针对子项目的编译和部署 2、创建开发组件

【MATLAB源码-第190期】基于matlab的32QAM系统相位偏移估计EOS算法仿真,对比补偿前后的星座图误码率。

操作环境&#xff1a; MATLAB 2022a 1、算法描述 1. 引言 M-QAM调制技术的重要性 现代通信系统追求的是更高的数据传输速率和更有效的频谱利用率。M-QAM调制技术&#xff0c;作为一种高效的调制方案&#xff0c;能够通过在相同的带宽条件下传输更多的数据位来满足这一需求…

云打印怎么下单?网上云打印下单教程来了!

近些年来&#xff0c;随着移动互联网的发展&#xff0c;云打印也越来越火热。如今有越来越多的用户选择云打印服务。但是现在仍有很多不知道如何下单。那么云打印怎么下单呢&#xff1f;今天小易就来和大家介绍一下网上云打印的下单教程。 云打印怎么下单&#xff1f;网上云打印…

MYSQL45道练习题---持续更新中

来源&#xff1a; Mysql_45道练习题 - 简书 共四张表&#xff1a; ①、course表&#xff1a; CId&#xff1a;课程id Cname&#xff1a;课程名称 TId&#xff1a;老师id ②、student学生表&#xff1a; SId&#xff1a;学生id Sname&#xff1a;…

【Linux】进程的程序地址空间①

目录 前言&#xff1a; 1.什么是地址空间 区域划分 页表&#xff1a; 2.为什么要有地址空间 2.1 进程与内存解耦合 2.2安全 3.凭什么说进程具有独立性&#xff1a; 4.用地址空间解释一下申请内存 前言&#xff1a; 在C语言中&#xff0c;我们说我们将内存分为&#xff0c;栈区…

vue3组件之间的传参

1、父传子 defineProps 父组件 <script setup>import { reactive } from vue;import Children from ./children.vue;const parentProps reactive({name:zhangsan,age:20})</script><template><div>这是父组件</div><div>子组件:<Chil…

探索大型语言模型(LLM)在人类性格个性评估(MBTI)中的前景与应用

1.概述 大型语言模型&#xff08;LLM&#xff09;如ChatGPT在各个领域的应用确实越来越广泛&#xff0c;它们利用庞大的数据集进行训练&#xff0c;以模拟人类的语言理解和生成能力。这些模型在提供信息、解答问题、辅助决策等方面表现出了强大的能力&#xff0c;但它们并不具…

AI大模型之路 第二篇: Word2Vec介绍

你好&#xff0c;我是郭震 今天我来总结大模型第二篇&#xff0c;word2vec&#xff0c;它是大模型的根基&#xff0c;一切NLP都会用到它。 Word2Vec Word2Vec 是一种流行的自然语言处理&#xff08;NLP&#xff09;工具&#xff0c;它通过将词汇表中的每个单词转换成一个独特的…

优先级队列(概念理解/底层模拟/时间复杂度分析)

目录 1.概念理解 2.优先级队列的底层模拟 2.1堆的概念 2.2优先队列的模拟实现 2.2.1把Heap类定义好 2.2.2初始化堆 2.2.3创建大堆 1.思路 以此二叉树为例&#xff1a; 图文理解&#xff1a; 2.思路转化为代码 2.2.4堆操作之offer&#xff08;进队列&#xff09; 1…

机器学习-10-基于paddle实现神经网络

文章目录 总结参考本门课程的目标机器学习定义第一步&#xff1a;数据准备第二步&#xff1a;定义网络第三步&#xff1a;训练网络第四步&#xff1a;测试训练好的网络 总结 本系列是机器学习课程的系列课程&#xff0c;主要介绍基于paddle实现神经网络。 参考 MNIST 训练_副…

【Node.js】01 —— fs模块全解析

&#x1f525;【Node.js】 fs模块全解析 &#x1f4e2; 引言 在Node.js开发中&#xff0c;fs模块犹如一把万能钥匙&#xff0c;解锁着整个文件系统的操作。从读取文件、写入文件、检查状态到目录管理&#xff0c;无所不能。接下来&#xff0c;我们将逐一揭开fs模块中最常用的那…

vue ant form validate如何对数组下的表单校验

问题 使用Ant Design Vue校验表单时&#xff0c;通过validateFields&#xff0c;但是如何一个数组内部的校验呢&#xff1f; 效果图&#xff1a; 实现方式&#xff1a; 通过 v-for 循环渲染:name"[]"实现&#xff0c;我们直接看代码。 <template><a-for…

Spring Boot中JUnit 4与JUnit 5的如何共存

文章目录 前言一、先上答案二、稍微深入了解2.1 maven-surefire-plugin是什么2.2 JUnit4和JUnit5有什么区别2.2.1 不同的注解2.2.2 架构 前言 在maven项目中&#xff0c;生成单测时是否有这样的疑问&#xff1a;该选JUnit4还是JUnit5&#xff1f;在执行 mvn test 命令时有没有…

三、SpringBoot整合MyBatis

本章节主要描述MyBatis的整合&#xff0c;以及使用mybatis-generator-maven-plugin生成代码骨架&#xff0c;源码&#xff1a; jun/learn-springboot - Gitee.com 一、首先建数据库 本示例用的是MySQL8.0.23&#xff0c;建表t_goods、t_orders&#xff0c;略... 二、goods模块…