小程序学习doy01开发者证号注册

51 阅读3分钟

概念 : 是一种不需要下载,就可以使用的应用,它实现了应用触手可及的梦想,用户扫一扫或者搜一下就可以打开应用实现了用完即走的理念 特点: 1. 无需下载(一般不超过2m) 2. 解放内存

1.2 注册账号#

开发微信小程序前首先要在微信公众平台申请一个小程序账号,通过这个账号对小程序的开发进行管理。

浏览器打开 微信公众平台 网址,点击右上角的 "立即注册" 即可进入到小程序开发账号的注册流程

注册账号

  1. 选择注册的帐号类型

注册账号

  1. 填写账号信息

注册账号

注意:

这里要注意所填写的邮箱要求曾经没有注册过小程序、服务器、订阅号。

  1. 邮箱激活

注册账号

  1. 点击链接激活账号

注册账号

  1. 选择主体类型

注册账号

  1. 主体登记信息

注册账号

注意:

使用自已的微信扫码将自已设置为小程序账号的管理员,将来对小程序的开发及设置进行管理。

1.3 小程序信息#

账号注册完毕后不能立刻使用,还需要进一步对小程序的信息进行完善,具体的操作步骤如下图所示参考老师课堂演示。

小程序信息

WARNING

在填写小程序类目时不要选择游戏类型,否则视为小游戏开发了。

1.4 获取AppID#

AppID 是小程序的唯一标识,在对小程序进行开发或者上线发布时都会用到 AppID,获取方式如下图所示:

获取AppID

注意:

在开发和发布小程序时必须要填写 AppID : wx538a2b903d90207d

1.5 微信开发者工具

开发者工具的主要功能: 快速创建小程序项目(类似手脚架) 代码的查看和编辑(vs code) 对小程序功能进行调试(浏览器) 小程序的浏览和发布

目录结构 .wxml 用于页面的布局 .wxss 用于页面的样式 .js 用于页面的逻辑 .json 用于页面的配置 每个页面文件类型的文件必须同名 特殊目录 app.js 小程序入口 app.json 小程序的全局配置 app.wxss 小程序的全局样式 project.config.json 小程序开发者工具配置 sitemap.json 小程序搜索优化 页面导航布局 view 定义一个块级元素 div text 定义一个行内元素 span 适配 rpx 常用组件 1 .wxml文件 swiper + swiper-item image 属性 indicator-dots 面板指示点 autoplay 自动切换 circular 衔接滑动 indicaor-color 指示点颜色 跳转 navgator 相当于a标签

2 .js文件 必须调用Page({ data:{xx:xxx } }) 通过{{xx}}插值来渲染数据 时间监听 : 1 bind事件名=“事件回调” 和 bind-事件名=“事件回调” 大部分事件类型和网页都是一样的 点击事件是不一样的 click 需要 改成tap

3. .json文件
    
    "pages":[""]来配置路径   
    
    widow :配置状态栏 导航条 标题 窗口背景色 
        navigationStyle              导航栏样式 仅支持 黑 白色
        navigationBarTitleText       导航栏文字
        navigationBarTextStyle       导航栏文字颜色 只支持 黑 白色
        endablePullDownRefresh       是否开启全局下拉刷新
        navigationBarBackgroundColor  导航栏背景色仅支持16进制颜色
     tabBar: tab栏
        list 列表数 2-5个
            pagePath 页面路径必须先定义
            text 按钮颜色
            iconPath 图片路径 40kp大小
            selectedIconPath 图片路径
        color 文字默认颜色 16 进制
        selectedCOlor 文字被选中颜色 16进制
        backgroColor  背景色16
        borderSryle 上边框颜色
        position 位置
        
    
    

创建文件夹后 右键然后选择新建Page输入名称可以快速创建 .wxml .js .json .wxss文件并且文件路径会添加到全局.json 文件中

使用

坑1: tabBar 配置之后的链接 无法在页面中使用navigator再去跳转 没配置则可以点击跳转 坑2 : tabBar 如果没配置首页的话无发显示出来底部导航栏