从零开始的小程序开发之路 看这一篇就够了！(适用于有基础)

实验1：第一个微信小程序

一、实验目标

1、学习使用快速启动模板创建小程序的方法；2、学习不使用模板手动创建小程序的方法。

二、实验步骤

1. 安装微信开发者工具

2. 建立新项目模板

3. 修改navigator颜色为 #663399

    

4. 在wxml文件中用image text button组件实现昵称 头像 格言 按钮展示

  <view class="userinfo">
    <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
    <text class="userinfo-nickname">{{userInfo.nickName}}</text>               <!-- <block wx:elif="{{!hasUserInfo}}">
      <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
      <button wx:elif="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
      <view wx:else> 请使用1.4.4及以上版本基础库 </view>
    </block>
    <block wx:else>
      
    </block> -->
  </view>
  <view class="usermotto">
    <text class="user-motto">{{motto}}</text>
    <button class="getavatar" bindtap="getUserProfile" >获取头像昵称</button>
  </view>

这里面button绑定的是微信提供的模板中的getuserprofile方法

三、程序运行结果

 

 

 

四、问题总结与体会

微信堆获取信息的方法有很多种，需要进行选择

button的方法绑定是bindtap加函数名

不知道为什么在手机上预览时无法获取头像昵称信息