开发手机小程序 第1篇
1. 小程序中组件的分类
小程序中的组件也是由宿主环境提供的，开发者可以基于组件快速搭建出漂亮的页面结构。官方把小程序的组件分为了 9 大类，分别是：
① 视图容器 ② 基础内容 ③ 表单组件 ④ 导航组件 ⑤ 媒体组件 ⑥ map 地图组件 ⑦ canvas 画布组件 ⑧ 开放能力 ⑨ 无障碍访问
2. 常用的视图容器类组件
① view ⚫ 普通视图区域 ⚫ 类似于 HTML 中的 div，是一个块级元素 ⚫ 常用来实现页面的布局效果 ② scroll-view ⚫ 可滚动的视图区域 ⚫ 常用来实现滚动列表效果 ③ swiper 和 swiper-item ⚫ 轮播图容器组件 和 轮播图 item 组件
右下角第4段代码解释：
.container1 这里的.表示选择器是一个类选择器。container1是类名，这意味着这个样式规则将应用于所有具有container1类的HTML元素。
display: flex;： 当一个元素设置为display: flex;后，它的直接子元素将按照弹性盒模型（Flexbox）的布局方式排列。Flexbox是一种用于在容器内分配和对齐子元素的一维布局方法。
justify-content: space-around justify-content属性用于设置弹性容器内弹性项目在主轴上的对齐方式。 space-around值表示弹性项目将在主轴上平均分布，每个项目两侧的空间相等
开发手机小程序 第2篇
提示：提交审核阶段有些需要注意的事项，一个是小程序的代码最大限制为2M，如果有分包的话可以有更大容量，如果您需要与后端交互，建议把所有相关的图片放到服务器上，另一个就是注册小程序前需检查小程序的logo和名字是否已经被注册过，是否被别人注册了商标
代码以及课件和视频资源领取方式： 关注公众号：小猿搜码 后台发送：csdn小程序
开发手机小程序 第3篇
小程序账号注册 ，在这个网页注册好自己的账号后，进入 小程序后台 ，查看并记录自己的AppID，有了这个你的小程序才能上线！在这里你可以管理你的小程序的权限，如查看数据报表，发布小程序等。
微信开发者工具就是开发小程序的IDE，当然也可以用VsCode，看个人习惯，新手用开发者工具没毛病。 进入下面网页按电脑配置下载相应安装包就行啦。 开发者工具下载 我们打开微信开发者工具 起一个项目名，选一个目录，不使用云服务，模板选JavaScript-基础模板，ok！
开发手机小程序 第4篇
page存放当前小程序所有页面的路径，可以不主动添加，可直接在目录下右击新建页面，page会自动注册增加该页面的路径。
1. 什么是WXML
WXML（WeiXin Markup Language）是小程序框架设计的一套标签语言，用来构建小程序页面的结构，其作用类似于网页开发中的 HTML。 2. WXML 和 HTML 的区别
① 标签名称不同 ⚫ HTML （div, span, img, a） ⚫ WXML（view, text, image, navigator） ② 属性节点不同
③ 提供了类似于 Vue 中的模板语法 ⚫ 数据绑定 ⚫ 列表渲染 ⚫ 条件渲染
WXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式，类似于网页开发中的 CSS。
WXSS 和 CSS 的区别
① 新增了 rpx 尺寸单位 ⚫ CSS 中需要手动进行像素单位换算，例如 rem ⚫ WXSS 在底层支持新的尺寸单位 rpx，在不同大小的屏幕上小程序会自动进行换算
② 提供了全局的样式和局部样式 ⚫ 项目根目录中的 会作用于所有小程序页面 ⚫ 局部页面的 .wxss 样式仅对当前页面生效
③ WXSS 仅支持部分 CSS 选择器 ⚫ .class 和 #id ⚫ element ⚫ 并集选择器、后代选择器 ⚫ ::after 和 ::before 等伪类选择器
开发手机小程序 第5篇
其实不是所有的逻辑都必须在js中定义，简单的条件判断，如 if else， 可以在wxml中定义。 先在js文件的data中加入
然后在wxml中，加入
编译，会发现 条件渲染if 被打印出，如果data中把 isCreated 改成 false，则 条件渲染else 被打印出，这就是条件渲染，选择性地显示内容。
就是按一下按键后触发的功能，我们叫为触发事件。我们先来创建一个按键，在wxml使用
type定义按键的大小，primary是正常，mini是迷你。bindtap=“handleTap” 把按键绑定到了一个叫 handleTap 触发事件，这个事件需要到js文件定义。 在js中，接着data，新建一个函数 handleTap
点一下编译，按一下按键，发现终端打印出了click！点一下就打印一下，说明我们的事件触发功能成功！ 进阶一下，如果想要按一下就改变前面定义的mytext和isCreated变量，怎么办？easy：
需要注意，小程序里改变量的值必须得这么搞，直接mytext：。。。会报错。
开发手机小程序 第6篇
在pages目录下新建文件夹，命名为demo demo文件夹下新建页，命名也是demo，回车 直接自动生成 js、json、wxml和wxss 四个基本文件，方便得不行！ 有个更绝的方法，进入，在pages里加入一个页面的地址，直接生成改名称的文件夹并包含四个基本文件。 将pages/demo/demo往上移到第一位，再按一下编译，发现小程序一开始进入的页面就变成了我们新建的demo页，因为我们还没加代码，所以只显示了一条默认的地址，下面开搞！
我们可以看到里面的window代码如下 把它改为
编译，发现上方显示栏变了，#f60是橙色
打开文件，会发现只有一条
data中放的就是初始化的数据，试一下放上上面的数据，在wxml中：
试一下在wxml跑下面的代码：
结果如下，它能把data中定义的datalist数组中所有数据打印出（动态数组遍历），我们的备忘录需要用到这个功能！
每个标签都可以定义一个class，如
这时这个hello就可以在css文件里定义样式！ 打开wxss，
发现hello变成了 也可以直接对view进行定义，这样所以的view标签都会被统一定义，class就会更灵活一点。
注意！定义class的样式需要前面加个小数点 . ，直接对标签操作则不需要。