微信小程序

一、项目、配置简介

1、目录文件介绍

微信小程序_第1张图片

 微信小程序_第2张图片

 微信小程序_第3张图片

二、小程序框架:逻辑层、视图层

1、wxml设置数据和js修改数据   this.setData()

微信小程序_第4张图片

2、点击事件  bindtap

wxml

 Hello {{name}}! 
  

js

Page({

  changeName(){
    this.setData({
      name:'MINA'
    })
  }
})

微信小程序_第5张图片

3、注册小程序

微信小程序_第6张图片

4、behaviors

微信小程序_第7张图片

5、Componet控件

微信小程序_第8张图片

 6、路由;页面跳转

微信小程序_第9张图片

微信小程序_第10张图片

7、 模块化  module.exports

微信小程序_第11张图片

8、列表渲染:for循环    wx:for

{{item}}

 微信小程序_第12张图片

 9、条件渲染 wx:if  wx:elif  wx:else

 微信小程序_第13张图片

 

10、模版