2024/2/4学习记录

微信小程序

网络数据请求

出于安全性方面的考虑,小程序官方对数据接口得请求做出了俩个限制

  • 只能对 https 类型的接口
  • 必须将接口的域名添加到信任列表中

需要去这里设置

  • 域名只支持 https 协议
  • 域名不能使用 ip 地址 或者localhost
  • 域名必须经过 ICP 备案

服务器域名一个月内最多可申请5次修改

发请求

调用微信小程序提供的 wx.request() 方法,可以发起 get 请求

因为目前没有可用的域名,所有我就只是 随便写了一个。

如果需要发送post请求,修改method就好了

在页面刚加载时请求数据

通过调用 onload 事件

如果后端仅仅提供了 http 协议的接口,暂时没有提供 https 协议的接口

此时我们可以 开启 开发环境不校验请求域名,TLS 版本及 HTTP5 证书 选项,跳过 request 合法域名的校验

跨越问题

跨域问题 只存在基于浏览器的web开发中,由于小程序的宿主环境不是浏览器,而是微信客户端,所以小程序不存在跨越问题

小程序里面是没有 axios 请求的,只是叫做基于网络请求

导航到 tabBar

调用 wx.switchTab(Object object) 方法,可以跳转到 tabBar 页面,其中Obejct参数对象的属性列表如下:

导航到 非 tabBar 页面

调用 wx.navigateTo(Object object) 方法,可以跳转到 非 tabBar 的页面,其中 Object 参数对象 的属性列表如下:

后退导航

调用 wx.navigateBack(Object object) 方法,可以返回到 上一页面或多级页面,其中 Object 参数对象 可选的属性列表如下:

导航传参

声明式导航传参

navigator 组件的 url 属性用来指定将要跳转到的页面的路径,同时,路径后面还可以携带参数,参数的用法和 web 参数传递是一样的

编程式导航传参

调用 wx.navigateTo(Object object) 方法跳转界面时,也可以携带参数

如若想得到这些参数,是可以在 onload 事件的 option 里面找到参数的值

页面事件

下拉刷新

启用方式

  • 全局开启下拉刷新

在 app.json 的 window 节点中,将 enablePullDownRefresh 设置为 true

  • 局部开启下拉刷新

在页面的 json 文件中设置 enablePullDownRefresh 设置为 true

监听页面的 下拉刷新事件

在页面的 .js 文件中,通过 onPullDownRefresh() 函数即可监听当前页面的下拉刷新事件

停止 下拉刷新的效果

当处理完下拉刷新后,下拉刷新的 loading 效果 会一直显示,不会主动消失,所以需要手动去关闭,调用 wx.stopPullDownRefresh() 可以停止当前页面的下拉刷新。

上拉触底

在页面的 .js 文件中,通过 onReachButton() 函数即可监听当前页面上的上拉触底

自定义编译模式

生命周期

是指一个对象从 创建 -> 运行 -> 销毁 的整个阶段,强调的是一个时间段。

小程序生命周期的分类

在小程序中,生命周期分为俩类,分别是

  • 应用生命周期

特指小程序从 启动 -> 运行 -> 销毁的过程

在 app.js 中:

  • onLaunch:function(options){}

小程序完成初始化时,执行此函数,全局只能触发一次

  • onShow:function(options){} 

小程序启动,或者从后台进入前台显示时触发

  • onHide:function(){}

小程序从前台进入后台时触发

  • 页面生命周期

特指 小程序中,每个页面 的加载 -> 渲染 -> 销毁的过程

  •  onLoad:function(options){}

监听页面加载,一个页面只调用一次

  • onShow:function(){} 

监听页面显示

  • onReady:function(){}

监听页面初次渲染完成,一个界面只调用一次

  • onHide:function(){}

监听页面隐藏

  • onUnload:function(){}

监听页面卸载,一个界面只调用一次

wxs 脚本

是小程序独有的一套脚本语言,结合为wxml,可以构建出页面的结构

wxs 和 JavaScript 的关系

虽然wxs的语法类似于JavaScript ,但是wxs和JavaScript是完全不同的俩种语言

  • wxs 有自己的数据类型

number  string boolean  object  function  array  date  regrexp

  • wxs 不支持 类似于 es6 以上的语法形式

不支持 let const 解构赋值 展开运算符 箭头函数 对象属性 等等

支持 var 定义变量 普通 function 函数类似于 ES5 的语法

  • wxs 遵循 CommonJS 规范

module 对象  require 函数  module.exports 对象

内嵌 wxs 脚本

wxs 代码可以编写在 wxml 文件中的 <wxs> 标签内,就像 JavaScript 代码可以编写在 html 文件中的<script> 标签内一样

wxml 文件中的每个 <wxs></wxs> 标签,必须提供 module 属性,用来指定 当前 wxs 的模块 名称,方便在 wxml 中访问模块 中的成员

定义外联的 wxs 脚本 

wxs 代码还可以编写在 以 .wxs 为后缀名的文件内,就像 JavaScript 代码可以编写在 .js 为后缀名的文件中一样。

在 wxml 中引入 外联的 wxs 脚本时,必须为 <wxs> 标签添加 module 和 src 属性,其中:

  • module 用来指定模块的名称
  • src用来指定要引入的脚本的路径,且必须是相对路径

wxs 具有隔离性  不能调用 js 中定义的函数  wxs 不能调用小程序提供的 API

创建组件

在项目的根目录中,创建 components -> test 文件夹,然后在此基础上点击 新建 Component ,输入组件的名称之后回车,会自动生成 组件对应的 4个 文件,后缀名分别为 .js  .json  .wxml  .wxss

引用组件

引用方式分为 全局引用 和 局部引用

局部引用

在页面的  .json  配置文件中引用组件的方式,叫做 “局部引用”

然后就可以以标签的形式来使用这个组件

全局组件就是在 app.json 里面这样写,就能都使用上了。

组件和页面的区别

从表面上看,他们没什么区别,但是组件 和 页面的 js 文件于 json 文件有明显的不同

  • 组件的 .json 文件中需要声明 "component":true 属性
  • 组件的 js 文件中调用的是 Component() 函数
  • 组件的事件处理函数需要定义到 methods 节点中

组件样式是隔离的,不会相互影响,全局样式对 组件是无效的,只有 class 选择器会有样式隔离效果,id选择器 属性选择器 标签选择器 不受样式隔离的影响

默认情况下,自定义组件的样式隔离特性 能够 防止组件内外 样式互相干扰的问题,但是有时候,我们希望他们 能够控制 组件内部的样式,此时 可以通过 stylesolation 修改组件的样式隔离选项

styleIsolation 的可选值

properties 属性

在小程序组件中,properties 属性是组件的对外属性,用来接收外界传递到组件中的数据:

该说不说,好像 vue 的 props 写法

data 和 properties 数据用法相同 都是可读可写的,vue的props是只读的。它俩是可以互相访问的,貌似地址是一样的。可以使用 setData 来修改 properties的值

数据监听器

observers  用于监听和响应任何属性和数据字段的变化,从而执行特定的操作,类似于 vue 的watch 监听器。

基本语法:

如果要监听对象的某个属性,那么在前面就要写 对象.属性,function 里面写属性的新值

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

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

相关文章

风险管理和采购管理核心考点梳理

个人总结&#xff0c;仅供参考&#xff0c;欢迎加好友一起讨论 PMP - 风险管理和采购管理核心考点梳理 风险管理 风险是一个中性词&#xff0c;包括机会和威胁。风险管理的子过程非常多&#xff0c;但是相对来说子过程之间的逻辑非常清晰&#xff0c;整个风险管理的过程都是在维…

Android BitmapShader setLocalMatrix缩放Bitmap高度重新onMeasure,Kotlin

Android BitmapShader setLocalMatrix缩放Bitmap高度重新onMeasure&#xff0c;Kotlin <?xml version"1.0" encoding"utf-8"?> <LinearLayout xmlns:android"http://schemas.android.com/apk/res/android"xmlns:tools"http://sc…

OpenResty 安装

安装OpenResty 1.安装 首先你的Linux虚拟机必须联网 1&#xff09;安装开发库 首先要安装OpenResty的依赖开发库&#xff0c;执行命令&#xff1a; yum install -y pcre-devel openssl-devel gcc --skip-broken2&#xff09;安装OpenResty仓库 你可以在你的 CentOS 系统中…

docker常见操作

一、查看docker版本 docker version 二、查找docker镜像 docker search centos name&#xff1a;相关镜像的名称 description&#xff1a;镜像描述-尽量下载官方镜像 stars&#xff1a;星数 三、查看镜像 docker images 四、拉取镜像 docker pull 【image】 五、删除镜…

使用Nginx,后端服务器获取客户端IP地址

项目背景 多个客户端通过一个路由器访问在外部搭建的服务器&#xff1b;类似下图 目的 服务器获取客户端真实IP Nginx配置文件 location /api {proxy_pass http://198.1.1.127:8099/mark;proxy_set_header X-Real-IP $remote_addr;proxy_set_header X-Forwarded-For $pro…

软件价值6-扫雷游戏

扫雷是一种经典的单人电脑游戏&#xff0c;通常在矩形方格区域内进行。游戏规则简单明了&#xff1a; 1. 地雷布局 游戏开始时&#xff0c;玩家面对一个由未知格子组成的矩形区域。其中&#xff0c;一些格子下埋有地雷&#xff0c;而其他格子是安全的。 2. 目标 玩家的目标是…

【Android Gradle 插件】自定义 Gradle 插件模块 ⑤ ( 完整总结 )

一、创建自定义插件类型模块 ( Java or Kotlin Library ) 选择 " 菜单栏 / New / New Module… " 选项 , 在 " Create New Module " 对话框中 , 选择 创建 " Java or Kotlin Library " 类型的依赖库 ; 二、手动导入相关依赖 ( Java | Groovy | …

2 月 3 日算法练习-数论

简单数论 思路&#xff1a;各个相邻数的差值求最大公约数得到 d&#xff0c;然后就能求出最少项数。 c17用gcd&#xff0c;c11 用_gcd #include<bits/stdc.h> using namespace std; using ll long long; const int N 1e5 10; ll a[N]; int n; int main( ){cin>>…

vivado 综合、时序分析

以下综合 运行完成后&#xff0c;将打开Synthesis Completed对话框&#xff0c;如下所示图形 选择其中一个选项&#xff1a; •运行实施&#xff1a;启动当前实施项目的实施设置。 •打开综合设计&#xff1a;打开综合网表、活动约束集和将目标设备集成到综合设计环境中&…

spring boot3x登录开发-上(整合jwt)

⛰️个人主页: 蒾酒 &#x1f525;系列专栏&#xff1a;《spring boot实战》 &#x1f30a;山高路远&#xff0c;行路漫漫&#xff0c;终有归途。 目录 前置条件 jwt简介 导依赖 编写jwt工具类 1.配置项直接嵌入代码&#xff0c;通过类名.静态方法使用 2.配置项写到…

最短编辑距离问题与动态规划----LeetCode 72.编辑距离

动态规划&#xff08;Dynamic Programming, DP&#xff09;是解决复杂问题的一个强大工具&#xff0c;它将问题分解成更小的子问题&#xff0c;并使用这些子问题的解决方案来构建整体问题的解决方案。在深入探讨最短编辑距离问题之前&#xff0c;让我们先理解什么是动态规划&am…

让cgteamwork自动为Houdini载入相机,角色道具的abc文件

一 需求 最近接到个需求&#xff1a;在创建EFX文件时&#xff0c;自动加载动画出的缓存abc文件相机&#xff0c; 不用手动一个个的载入&#xff0c;还容易出错 ABC文件自动导入到Houndini里 二 过程/效果 在CGTeamwork里打开对应的镜头&#xff0c;下面的文件列表显示相机和角…

格式化日期注解@JsonFormat的使用和TimeZone时区问题

JsonFormat的使用 目的 为了便于date类型字段的序列化和反序列化&#xff0c;需要在数据结构的Date、Timestamp、DateTime类型的字段上用JsonFormat注解进行注解 使用 JsonFormat注解是一个时间格式化注解&#xff0c;比如我们存储在mysql中的数据是date类型的&#xff0c;当…

自学Java的第58,59天

网络通信 网络通信三要素&#xff1a;ip地址&#xff0c;端口号&#xff0c;协议 ip地址 常用方法 写法 端口号 协议 UDP通信 快速入门 写法&#xff08;客户端&#xff09; &#xff08;服务端&#xff09; UDP通信 多发多收 TCP通信 写法&#xff08;客户端&#xff09; …

车载充电器(OBC)氮化镓(GaN)驱动(高压高功率)设计(第四篇)

上图来自于网络 1、GaN FET概念 GaN FET&#xff0c;全称为Gallium Nitride Field-Effect Transistor&#xff08;氮化镓场效应晶体管&#xff09;&#xff0c;是一种采用氮化镓&#xff08;Gallium Nitride, GaN&#xff09;材料制作的新型功率半导体器件。相较于传统的硅基…

物联网与智慧景区的未来:机遇与挑战并存

随着科技的不断发展&#xff0c;物联网技术在智慧景区中的应用越来越广泛&#xff0c;为旅游业带来了巨大的变革。然而&#xff0c;在物联网与智慧景区的未来发展中&#xff0c;机遇与挑战并存。本文将探讨物联网与智慧景区面临的机遇和挑战&#xff0c;并提出应对措施&#xf…

《幻兽帕鲁》解锁基地和工作帕鲁数量上限

帕鲁私服的游戏参数通常可通过配置文件 PalWorldSettings.ini 来进行修改&#xff0c;然而这个配置文件有个别参数对游戏不生效&#xff0c;让人很是头疼。没错&#xff01;我说的就是终端最大的帕鲁数量&#xff01; 其实还有另外一种更加高级的参数修改方式&#xff0c;那就…

使用Python和HTTP代理进行API请求

Python&#xff0c;这个简单易学又功能强大的编程语言&#xff0c;在网络爬虫、数据分析、自动化任务等领域都有着广泛的应用。而当我们需要从外部网站获取数据时&#xff0c;API&#xff08;应用程序接口&#xff09;就成了我们的得力助手。但有时候&#xff0c;某些网站会对A…

vscode 无法远程连接waiting the server log

使用版本 报错信息 相关日志 [17:32:59.765] > Waiting for server log... [17:32:59.801] > Waiting for server log... [17:32:59.831] > > * > * Visual Studio Code Server > * > * By using the software, you agree to > * the Visual Studio…

【C/C++ 12】C++98特性

目录 一、命名空间 二、缺省参数 三、函数重载 四、引用 五、内联函数 六、异常处理 一、命名空间 在C/C项目中&#xff0c;存在着大量的变量、函数和类&#xff0c;这些变量、函数和类都存在于全局作用域中&#xff0c;可能会导致命名冲突。 使用命名空间的目的就是对…