阶段九：微信小程序：基本使用教程

1. 申请微信小程序： 申请账号：183xxx@163.com 密码：wx12345678

2. AppID(小程序ID) | wx8a41374f9a2c6ea2 |

3. 下载开发者工具

4. 创建项目

5. 小程序配置

6. 组件标签

7. 微信结构说明： .wxml ==> html

    view ==> div 主要
    text 文字 :可以长按选中
    image ==》 img  标签一定要闭合  <image />
    没有 h1-h6标签
    block 相当于大组件
   

   .wxss ==> css

    弹性合布局
    rpx 单位：是适配屏幕的 
   

8. .js .js存放数据： 是数据驱动 不是dom驱动

   .js存放数据：data:{ motto: 'Hello World'}
   .wxml展示数据：{{motto}}
   

   列表循环渲染：

    .js存放数据：data: {lists:['a','b','c']}
    .wxml展示数据：
       <view wx:for="{{lists}}" wx:key="index">
          {{item}}{{index}}
      </view>
      
   

9. 没有alert方法

10. 事件

 bind:不会阻止冒泡

 catch: 会阻止冒泡
 
 <view bindtap="btn"> </view>
 

10 如何修改data中的数据

  <view bindtap="btn"> </view>
  data: {str:"这是小程序"}
  btn(){
    this.setData({
        str:'我来修改你了'
    })
  }
  

11 .js生命周期

12 JSON页面配置 如果局部没有对应的配置定义，默认走全局配

局部导航头部样式配置：

13 tabBar，在josn中配置

14. 接口请求 14.1 一进来进请求接口展示数据 在.js生命周期 onLoad() {}里面写

方式一：url直接写（不好）

方式二： 1.在 util.js文件写url 抛出去

2. index.js 引入 util.js

3.发送请求的时候直接使用这个变量

15. 页面跳转路由：

    15.1 点击 北京跳转页面：添加点击事件： bindtap="toLogs"

15.2 跳转到 logs中 永远用 witchTab 否则报错（新手注意，请看图二的说明）

说明：如果json中 tabBar中配置了对应的页面路径 必须用witchTab

15.3 如果是跳转到 list 用 navigateTo 否则 无法跳转

16. 页面跳转传参 有这 5步

17. template模板使用 17.1 目录结构

17.2 写一个template模板

17.3 使用template模板

17.4 css引入

其他页面也使用 上面创建好的template模板：点击button按钮跳转到其他页面 使用template模板