微信开发者平台学习笔记(1)——获取微信头像昵称

时间:2024-03-27 21:34:13

这次学习只为了解,不深入,看了B站一个讲得很好的学长记录的笔记。
下载微信开发者工具之后,微信扫码登录,创建小程序,在AppID中选择测试号,这样对于开发者测试比较方便。

编译界面如图,(打码部分是微信昵称和头像)
微信开发者平台学习笔记(1)——获取微信头像昵称

1.创建页面

  1. 编译方法: (1)界面有“编译”快捷按钮; (2)快捷键ctrl+s
  2. .js .json .wxml .wxss不同文件的注释方法都略有不同,需要注意
  1. 全局文件有三个:app.js app.json app.wxss (名称不可更改);

  2. 创建Pages目录文件,用来存放各个页面;

  3. 创建页面,页面名字以及4个文件
    1)js:页面逻辑实现
    2)json:负责标题栏和一些状态栏
    3)wxml:管理页面内容
    4)wxss:页面排布

  4. 把内容单元封装在view内部: <view>内容</view>
    用class方式进行页面布局,class也可以对组件进行布局,
    class规定的样式名称前要加 ’ . ’ ,也可以对image、text组件不加点进行全局布局。

  5. 获取图片、文字、按钮的组件,在index.wxml中进行
    1)图片 <image src='图片路径 '></image>
    2)文字 <text>内容</text>
    3)按钮 <button "属性内容">按钮上的内容</button>

  6. 页面设计
    在index.wxml中会有<view class="container"> </view>,container是自命名的一个容器,这个容器放在index.wxss文件中,主要是设计样式。

  7. 逻辑设计,在index.js文件中进行
    函数定义方法:函数名:function(参数列表){函数内容}, (函数结尾要有逗号)
    变量定义方法:data:{变量名称:‘内容’} (两个变量的定义之间用逗号隔开)

2.示例对应解释

  1. index.wxml中的内容
    微信开发者平台学习笔记(1)——获取微信头像昵称

  2. index.js中部分内容
    微信开发者平台学习笔记(1)——获取微信头像昵称
    微信开发者平台学习笔记(1)——获取微信头像昵称

  3. index.wxss对应内容
    微信开发者平台学习笔记(1)——获取微信头像昵称