当前位置: 首页 > news >正文

微信小程序--原生

1:数据绑定

1:数据绑定的基本原则

2:在data中定义页面的数据

3:Mustache语法

4:Mustache的应用场景

1:常见的几种场景

2:动态绑定内容

3:动态绑定属性

4:三元运算

4:算数运算

2:事件绑定

1:什么是事件

2:小程序中常用的事件

3:事件对象的属性列表

4:target和currentTarget的区别

5:bindtap的语法格式

6:在数据处理函数中为data中的数据赋值

7:事件传参

8:bindinput的语法格式

9:实现文本框和data之间的数据同步

1:定义数据

2:渲染结构

3:美化样式

4:绑定input事件处理函数

3:条件渲染

1:wx:if与wx:elif和wx:else

2:结合<biock>标签使用wx:if

3:hidden

3:wx:if与hidden的对比

1:运行方式不同

2:使用场景

4:列表渲染

1:wx:for

2:手动指定索引和当前项的变量名*(*了解就行)

3:wx:key的使用

5:模板样式

1:什么是wxss

2:wxss和css之间的关系(wxss扩展的特性)

1:rpx尺寸单位

1:什么是rpx尺寸单位

2:rpx的实现原理

3:rpx与px之间的单位换算*(*了解就行)

2:@import的语法格式

6:全局样式和局部样式

1:全局样式

2:局部样式

7:全局配置

1:全局配置文件及常用的配置项

1:window

2:了解window节点常用配置项

3:设置导航栏的标题

4:设置导航栏的背景色(只支持16进制的颜色--#ccc)

5:设置导航栏的标题颜色

6:全局开启下拉刷新的功能

7:设置下拉刷新时窗口的背景色(只支持16进制的颜色--#ccc)

8:设置下拉刷新时 loading的样式

9:设置上拉触底的距离

10:什么是tabBar

11:tabBar的六个组成部分

11:tabBar节点的配置项

12:每个tab项的配置选项

2:实例配置tabBar

1:需求描述

2:实现步骤

3:步骤1-拷贝图标资源

4:步骤2-新建几个对应的tab页面

5:步骤3-配置tabbar选项

6:tabBar 页面展示效果

8:页面配置

1:页面配置文件的作用

2:页面配置和全局配置的关系

3:页面配置中常用的配置项

9:网络数据请求

1:小程序中网络数据请求的限制

2:配置request合法域名

3:发起get请求

4:发起post请求

5:在页面刚加载时请求数据

6:调过request合法域名校验

7:关于跨域和Ajax的说明

10:实现案例--本地生活的首页

1:效果以及实现步骤

1:新建项目并梳理项目解构

2:配置导航栏效果

3:配置tabBar效果

4:实现轮播图效果

1:js部分

2:html部分

5:实现九宫格效果

1:js部分

2:html部分

6:实现底部两个链接

1:html部分

<!-- 图片区域链接 -->
<view class="flexE colorW marginTB20"><view class="bgred W45 lineH200 flexCenter borderRa">商家推荐</view><view class="bgblue W45 lineH200 flexCenter borderRa">交友论坛</view>
</view>

2:css部分


.flexE{display: flex;justify-content: space-evenly;
}
.colorW{color: white;
}
.bgred{background-color: rgb(255, 128, 128);
}
.bgblue{background-color: rgb(133, 133, 255);
}
.W45{width: 45%;
}
.lineH200{height: 200rpx;
}
.marginTB20{margin-top: 20rpx;
}
.flexCenter{display: flex;justify-content: center;align-items: center;
}
.borderRa{border-radius: 8rpx;
}

2:总结

11:页面导航

什么是页面导航

1:小程序中实现页面导航的两种方式

1:声明式导航

1:声明式导航跳转到tabBar页

2:声明式导航跳转到非tabBar页

3:声明式导航--后退

2:编程式导航

1:编程式导航跳转到tabBar页

2:编程式导航跳转到非tabBar页

3:编程式导航--后退

2:导航传参

1:声明式导航传参

2:编程式导航传参

3:在onLoad中接收导航参数

12:页面事件

1:下拉刷新

1:什么是下拉刷新

2:启用下拉刷新

3:配置下拉刷新窗口的样式

4:监听页面的下拉刷新事件

5:停止下拉刷新的效果(下拉后不会自己恢复,需要手动恢复)

2:上拉触底

1:什么是上拉触底

2:监听页面的上拉触底事件

3:配置上拉触底的距离

4:上拉触底的案例

1:案例效果展示

2:案例的实现步骤

3:步骤1-定义获取随机颜色的方法

4:步骤2-在页面加载时获取初始数据

5:步骤3-渲染ui解构并美化页面效果

6:步骤4-上拉触底时获取随机颜色

7:步骤5-添加上拉加载的样式效果

8:步骤6-对上拉触底进行节流处理

3:自定义编译模式

13:生命周期

1:什么是生命周期

2:生命周期的分类

3:什么是生命周期函数

4:生命周期函数的分类

5:小程序中的应用生命周期函数

6:小程序中页面上的生命周期函数

14:wxs脚本

1:什么是wxs

2:wxs的应用场景

15:实现案例--本地生活列表页

相关文章:

微信小程序--原生

1&#xff1a;数据绑定 1&#xff1a;数据绑定的基本原则 2&#xff1a;在data中定义页面的数据 3&#xff1a;Mustache语法 4&#xff1a;Mustache的应用场景 1&#xff1a;常见的几种场景 2&#xff1a;动态绑定内容 3&#xff1a;动态绑定属性 4&#xff1a;三元运算 4&am…...

Django快速上手

1. 安装Django Django 4.x的版本只支持MySQL8及以上的版本了。如果mysql版本比较老&#xff0c;需要使用老版本的django。此处指定django版本为3.2.20 pip install -i https://pypi.tuna.tsinghua.edu.cn/simple django3.2.202. 创建项目 创建项目 在指定目录使用命令行创建项…...

Android, 笔记+课表的app实现

NoteSchedule: 笔记课表&#xff0c;不同于超表和课程格子等笔记类软件&#xff0c;笔记课表的核心是将课表和笔记进行深度绑定&#xff0c;点击每个课表&#xff0c;就进入到笔记view中&#xff0c;点击其中的item就可以进入到笔记详情&#xff1b; 该应用已上线&#xff0c;…...

Openlayers实战:多数据分散聚合

在飞机、轮船等地图显示的应用中,很多时候会用到数据聚合,Openlayers中提供了Cluster这个API ,他作为souce的一部分,设定distance值,如果2个点的间距小于 distance 所设置的数时,就会以聚合的方式显示。从而解决了数据淤积显示的状态,非常实用。 效果图 源代码 /* * @…...

9、Kubernetes核心技术 - Volume

目录 一、概述 二、卷的类型 三、emptyDir 四、hostPath 五、NFS 5.1、master服务器上搭建nfs服务器 5.2、各个slave节点上安装nfs客户端 5.3、创建Pod 六、PV和PVC 6.1、PV 6.1.1、PV资源清单文件示例 6.1.2、PV属性说明 6.1.3、PV的状态 6.2、PVC 6.2.1、PVC资…...

HTML <small> 标签

定义和用法 <small> 标签呈现小号字体效果。 <small> 标签和它所对应的 <big> 标签一样&#xff0c;但它是缩小字体而不是放大。如果被包围的字体已经是字体模型所支持的最小字号&#xff0c;那么 <small> 标签将不起任何作用。 与 <big> 标签…...

网页版Java(Spring/Spring Boot/Spring MVC)五子棋项目(四)对战模块

网页版Java&#xff08;Spring/Spring Boot/Spring MVC&#xff09;五子棋项目&#xff08;四&#xff09;对战模块 一、约定前后端交互接口1. 建立连接接口2. 针对落子的请求和响应 二、实现前端页面三、实现后端1. 当用户进入房间&#xff0c;更新用户状态 OnlineUserManager…...

React实现关键字高亮

先看效果&#xff1a; 实现很简单通过以下这个函数&#xff1a; highLight (text, keyword ) > {return text.split(keyword).flatMap(str > [<span style{{ color: red, fontWeight: bold }}>{keyword}</span>, str]).slice(1);}展示某段文本时调用该函数…...

react-media如何使用

介绍 react-media 是 React 中用于响应式设计的一个很好的库。它可以用于在视口宽度满足特定条件时渲染组件。 主要功能包括: 媒体查询:通过 minWidth, maxWidth 和 width 等设置媒体查询条件。 渲染组件:当媒体查询条件匹配时渲染子组件。 默认样式:可以设置默认渲染的组件。…...

多进程利用TCP进行信息群发功能

/服务器的代码 #include <sys/types.h> #include <sys/socket.h> #include <netinet/in.h> #include <arpa/inet.h> #include <unistd.h> #include <string.h> #include <stdio.h> #include <stdlib.h> #define SEVER_IP &quo…...

git 报错 protocol ‘https‘ is not supported解决

报错原因&#xff1a;选择不了其他分支代码&#xff0c;甚至都看不到其他分支&#xff0c;我这边解决了两次报错&#xff0c;情况如下&#xff1a; 第一种报错&#xff1a; idea中刷新分支报错如下&#xff1a; Fetch Failed protocol https is not supported 话不多说&#…...

启动RocketMQ报错

说明&#xff1a;启动RocketMQ消费者时&#xff0c;报以下错误&#xff1a;java.lang.IllegalStateException&#xff1a;Failed to start RocketMQ push consumer. 解决&#xff1a;看下所有的监听器类&#xff0c;检查是不是有相同的消费者组名&#xff0c;注释掉其中一个即可…...

【Spring Boot系列】-Spring Boot过滤器Filter

【Spring Boot系列】-Spring Boot过滤器Filter 文章目录 【Spring Boot系列】-Spring Boot过滤器Filter一、概述二、Filter&#xff08;过滤器&#xff09;数据流程三、Spring Boot 过滤器生命周期四、使用注解方式实现过滤器(WebFilter)4.1. 在springboot 启动类添加该注解Ser…...

Leetcode-每日一题【剑指 Offer 14- I. 剪绳子】

题目 给你一根长度为 n 的绳子&#xff0c;请把绳子剪成整数长度的 m 段&#xff08;m、n都是整数&#xff0c;n>1并且m>1&#xff09;&#xff0c;每段绳子的长度记为 k[0],k[1]...k[m-1] 。请问 k[0]*k[1]*...*k[m-1] 可能的最大乘积是多少&#xff1f;例如&#xff0…...

【图论】单源最短路问题

Dijkstra算法 -- 这是我职业生涯中唯一一个会写&#xff0c;却叫不上名字的算法 Dijkstra算法是一种单源最短路径算法&#xff0c;用于找出图中从一个源点到其他所有点的最短路径。该算法的原理是采用贪心策略&#xff0c;每次将距离源点最近的点加入到已确定最短路径的集合中…...

物理层扩展以太网

扩展站点与集线器之间的距离&#xff1a;   在10BASE-T星型以太网中&#xff0c;可使用光纤和一对光纤调制解调器来扩展站点与集线器之间的距离。   为站点和集线器各增加一个用于电信号和光信息号转换的光纤调制解调器&#xff0c;以及他们之间的通信光纤。 扩展共享式以太…...

Llama 2 with langchain项目详解(一)

Llama 2 with langchain项目详解(一) 2023年2月25日,美国Meta公司发布了Llama 1开源大模型。随后,于2023年7月18日,Meta公司发布了Llama 2开源大模型,该系列包括了70亿、130亿和700亿等不同参数规模的模型。相较于Llama 1,Llama 2的训练数据增加了40%,上下文长度提升至…...

IDEA全局设置MyBatis中写SQL语句提示

把这两个设置改成MySQL即可&#xff1a;...

Linux 内存管理

顾名思义&#xff0c;Liunx内存管理子系统在系统中负责管理内存。它包括虚拟内存管理、段与页的实现、内核态与用户空的空间分配、将文件映射到进程空间等&#xff0c;很多很多酷炫的功能。 Linux内存管理是一个非常复杂的系统&#xff0c;它有非常多的可配置项。大部份这些配置…...

oracle怎样给某个普通用户授予杀自己用户会话的权限

一 问题描述 想给某个普通用户授予杀掉自己会话的权限 二 解决办法 2.1 用sys用户创建杀会话的存储过程 create or replace procedure scott_p_kill_session( v_sid number, v_serial number )asv_varchar2 varchar2(100);beginif v_sid is not null and v_serial is not n…...

如何在看板中体现优先级变化

在看板中有效体现优先级变化的关键措施包括&#xff1a;采用颜色或标签标识优先级、设置任务排序规则、使用独立的优先级列或泳道、结合自动化规则同步优先级变化、建立定期的优先级审查流程。其中&#xff0c;设置任务排序规则尤其重要&#xff0c;因为它让看板视觉上直观地体…...

智能在线客服平台:数字化时代企业连接用户的 AI 中枢

随着互联网技术的飞速发展&#xff0c;消费者期望能够随时随地与企业进行交流。在线客服平台作为连接企业与客户的重要桥梁&#xff0c;不仅优化了客户体验&#xff0c;还提升了企业的服务效率和市场竞争力。本文将探讨在线客服平台的重要性、技术进展、实际应用&#xff0c;并…...

(二)原型模式

原型的功能是将一个已经存在的对象作为源目标,其余对象都是通过这个源目标创建。发挥复制的作用就是原型模式的核心思想。 一、源型模式的定义 原型模式是指第二次创建对象可以通过复制已经存在的原型对象来实现,忽略对象创建过程中的其它细节。 📌 核心特点: 避免重复初…...

ElasticSearch搜索引擎之倒排索引及其底层算法

文章目录 一、搜索引擎1、什么是搜索引擎?2、搜索引擎的分类3、常用的搜索引擎4、搜索引擎的特点二、倒排索引1、简介2、为什么倒排索引不用B+树1.创建时间长,文件大。2.其次,树深,IO次数可怕。3.索引可能会失效。4.精准度差。三. 倒排索引四、算法1、Term Index的算法2、 …...

12.找到字符串中所有字母异位词

&#x1f9e0; 题目解析 题目描述&#xff1a; 给定两个字符串 s 和 p&#xff0c;找出 s 中所有 p 的字母异位词的起始索引。 返回的答案以数组形式表示。 字母异位词定义&#xff1a; 若两个字符串包含的字符种类和出现次数完全相同&#xff0c;顺序无所谓&#xff0c;则互为…...

Typeerror: cannot read properties of undefined (reading ‘XXX‘)

最近需要在离线机器上运行软件&#xff0c;所以得把软件用docker打包起来&#xff0c;大部分功能都没问题&#xff0c;出了一个奇怪的事情。同样的代码&#xff0c;在本机上用vscode可以运行起来&#xff0c;但是打包之后在docker里出现了问题。使用的是dialog组件&#xff0c;…...

Linux离线(zip方式)安装docker

目录 基础信息操作系统信息docker信息 安装实例安装步骤示例 遇到的问题问题1&#xff1a;修改默认工作路径启动失败问题2 找不到对应组 基础信息 操作系统信息 OS版本&#xff1a;CentOS 7 64位 内核版本&#xff1a;3.10.0 相关命令&#xff1a; uname -rcat /etc/os-rele…...

Java + Spring Boot + Mybatis 实现批量插入

在 Java 中使用 Spring Boot 和 MyBatis 实现批量插入可以通过以下步骤完成。这里提供两种常用方法&#xff1a;使用 MyBatis 的 <foreach> 标签和批处理模式&#xff08;ExecutorType.BATCH&#xff09;。 方法一&#xff1a;使用 XML 的 <foreach> 标签&#xff…...

Mysql8 忘记密码重置,以及问题解决

1.使用免密登录 找到配置MySQL文件&#xff0c;我的文件路径是/etc/mysql/my.cnf&#xff0c;有的人的是/etc/mysql/mysql.cnf 在里最后加入 skip-grant-tables重启MySQL服务 service mysql restartShutting down MySQL… SUCCESS! Starting MySQL… SUCCESS! 重启成功 2.登…...

JavaScript 数据类型详解

JavaScript 数据类型详解 JavaScript 数据类型分为 原始类型&#xff08;Primitive&#xff09; 和 对象类型&#xff08;Object&#xff09; 两大类&#xff0c;共 8 种&#xff08;ES11&#xff09;&#xff1a; 一、原始类型&#xff08;7种&#xff09; 1. undefined 定…...