IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 移动开发 -> 微信小程序基础入门[1] -> 正文阅读

[移动开发]微信小程序基础入门[1]

1、前言

??首先,你要为自己申请一个AppID。小程序的 AppID 相当于小程序平台的一个身份证。切记,每个邮箱仅能申请一个小程序。如果你用该邮箱注册了公众号等,那该邮箱就不能注册小程序了。(因为都是腾讯的产品)同时,对于个人小程序,个人的微信号只能注册绑定5个小程序。一般来说,我们都是申请个人小程序。

2、创建项目

??接下来进入微信开发者工具,我们开始创建一个新的项目。项目名称可以自己改,位置我是放到了E盘。默认使用云服务(推荐)。
1
??AppID需要进入小程序后台管理登录页查看:
2

3、代码和目录结构

??如果你是新手,你搜素微信小程序HelloWorld,会有很多视频告诉你要删这个删那个。确实很多东西没有用,但是不要着急删,你如果学过传统前端技术(html、css、javascript),你会发现二者其实是挺相似的。你可以看看这个文件夹是干啥用的,尝试修改代码然后编译看看有什么变化。
3
??cloudfunctions是默认的云函数文件夹,下面存放的全部都是云函数;miniprogram是默认的小程序项目文件夹。没别的情况,不要改这两个名字。如果你真的想改,重命名文件夹后,还要在project.config.json文件中修改相应代码。
4
??在miniprogram文件夹下面有组件文件夹(components)、图片文件夹(images)、页面文件夹(pages)、样式文件夹(styles)等,除了以上的文件夹,还有全局文件——app.js、app.json、app.wxss。
??值得注意的是,在components文件夹下的chatroom文件夹中,自定义了一个组件(不是页面,而是一个构成页面的组件),通过json申明:
在这里插入图片描述

??通过观察我们可以发现,一个模块通常由四个文件构成
5
??最基本的,小程序包含一个描述整体程序的 app 和多个描述各自页面的 page。一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:

文件必需作用
app.js小程序逻辑
app.json小程序公共配置
app.wxss小程序公共样式表

??一个小程序页面由四个文件组成,分别是:

文件类型必需作用
js页面逻辑
wxml页面结构
json页面配置
wxss页面样式表

??每一个模块/页面都以单独的文件夹进行保存,共同构成小程序。通过文件夹命名,不难猜测addFunction就是作用是添加的函数模块,databaseGuide肯定是数据库向导页面模块…
6
??特别的,工具型js文件、样式型wxss文件可以放在一个单独的文件夹中,我们可以灵活变通。
??小程序根目录下的 sitemap.json 文件用来配置小程序及其页面是否允许被微信索引。默认情况应该是都可以被索引。
7
??最后,全局文件都以app命名,全局文件内部申明的资源可以作用到所有文件中。
8
??值得注意的是,不同类型的json文件对应着不同的配置

  1. project.config.json:可以在项目根目录使用该文件对项目进行配置。比方说指定小程序源码的目录、指定腾讯云项目的目录等
  2. app.json:可以在小程序根目录使用该文件对微信小程序进行全局配置
  3. .json:每一个小程序页面可以使用同名 .json 文件来对本页面的窗口表现进行页面配置,页面中配置项会覆盖 app.json 的 window 中相同的配置项。
  4. sitemap.json:上文已讲过sitemap配置。

4、总结

??以上知识点均从官方文档中结合我的思路整理出来,是我的个人总结和经验。更加细致的讲解请参考官方文档。
??如果你觉得不错的话,请点个赞点个关注支持一下博主吧。有错误也请指出,谢谢!

  移动开发 最新文章
Vue3装载axios和element-ui
android adb cmd
【xcode】Xcode常用快捷键与技巧
Android开发中的线程池使用
Java 和 Android 的 Base64
Android 测试文字编码格式
微信小程序支付
安卓权限记录
知乎之自动养号
【Android Jetpack】DataStore
上一篇文章      下一篇文章      查看所有文章
加:2022-02-07 13:50:15  更:2022-02-07 13:50:50 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 15:00:40-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码