小白入门微信小程序

最新推荐文章于 2024-07-26 08:48:59 发布

博.Lin

最新推荐文章于 2024-07-26 08:48:59 发布

阅读量598

点赞数

文章标签：小程序

本文链接：https://blog.csdn.net/BoAkeji/article/details/110007484

版权

小白入门微信小程序1

第一次开发小程序。

第1章开发前的准备

注册小程序

1.1 注册开发者账号=>开发者首先要在微信公众平台注册一个小程序账号
	访问网页=>mp.weixin.qq.com 点击注册,选择=>小程序,登记信息=>邮箱(注意邮箱只能注册一个小程序)=>邮箱激活=>点击激活链接=>然后到登记信息=>填写个人资料=>最后填写验证码=>跳转到微信扫码=>扫码成功完成
1.2 完善小程序信息
	填写小程序名称=>上会头像=>小程序介绍=>小程序服务类目=>完成
1.3 管理小程序成员(看条款)
	成员类型说明
	成员人数限制
	成员变更说明

小程序开发工具

2.1 软件的下载与安装
	地址:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html
	选择计算机对应操作系统:Windows64位/Windows32位 安装
2.2 开发者工具的登录
	用微信扫一扫登录

第2章第一个微信小程序

手动创建项目

点击新建=>完成
页面配置

4.1 将app.json文件内page属性中的"pages/logs/logs"删除,并删除上一行末尾的逗号","
4.2 按快捷键 Ctrl+s 保存当前修改
4.3 删除 utils 文件夹及其内部所有内容
4.4 删除 pages 文件夹下的 logs 目录及其内部所有内容
4.5 删除 index.wxml 和 index.wxss 中的全部代码
4.6 删除 index.js 中的全部代码,并且输入关键词"page"找到contruct 回车自动补全函数
4.7 删除 app.wxss 中的全部代码
4.8 删除 app.js 中的全部代码,并且输入关键词"app"找到contruct 回车自动补全函数,点击保存
视图设计
5.1 导航栏设计
点击 app.json =>代码:
{
“page”:[
“pages/index/index”
],
“window”:{
“navigationBarBackgroundColor”:"#663399",
“navigationBarTitleText”:“我的第一个小程序”
}
}
5.2 页面设计

功能快捷键

撤销：Ctrl/Command + Z
重做：Ctrl/Command + Y
加粗：Ctrl/Command + B
斜体：Ctrl/Command + I
标题：Ctrl/Command + Shift + H
无序列表：Ctrl/Command + Shift + U
有序列表：Ctrl/Command + Shift + O
检查列表：Ctrl/Command + Shift + C
插入代码：Ctrl/Command + Shift + K
插入链接：Ctrl/Command + Shift + L
插入图片：Ctrl/Command + Shift + G
查找：Ctrl/Command + F
替换：Ctrl/Command + G

合理的创建标题，有助于目录的生成

直接输入1次#，并按下space后，将生成1级标题。
输入2次#，并按下space后，将生成2级标题。
以此类推，我们支持6级标题。有助于使用TOC语法后生成一个完美的目录。

如何改变文本的样式

强调文本 强调文本

加粗文本 加粗文本

标记文本

~~删除文本~~

引用文本

H₂O is是液体。

2¹⁰ 运算结果是 1024.

插入链接与图片

链接: link.

图片: Alt

带尺寸的图片:

居中的图片: Alt

居中并且带尺寸的图片:

当然，我们为了让用户更加便捷，我们增加了图片拖拽功能。

如何插入一段漂亮的代码片

去博客设置页面，选择一款你喜欢的代码片高亮样式，下面展示同样高亮的 代码片.

// An highlighted block
var foo = 'bar';

生成一个适合你的列表

项目
- 项目
  - 项目

项目1
项目2
项目3

计划任务
完成任务

创建一个表格

一个简单的表格是这么创建的：

项目	Value
电脑	$1600
手机	$12
导管	$1

设定内容居中、居左、居右

使用:---------:居中
使用:----------居左
使用----------:居右

第一列	第二列	第三列
第一列文本居中	第二列文本居右	第三列文本居左

SmartyPants

SmartyPants将ASCII标点字符转换为“智能”印刷标点HTML实体。例如：

TYPE	ASCII	HTML
Single backticks	`'Isn't this fun?'`	‘Isn’t this fun?’
Quotes	`"Isn't this fun?"`	“Isn’t this fun?”
Dashes	`-- is en-dash, --- is em-dash`	– is en-dash, — is em-dash