微信小程序入门，可跳过

pages，页面，

window 窗口

wxml html

wxss css

view div

微信公众平台

text span

image img

app.json 中配置页面

backgroundTextStyle 背景字体样式

  "enablePullDownRefresh": true     允许下拉刷新

  "navigationBarBackgroundColor": "#ff82ab",导航栏背景颜色

 "navigationBarTextStyle":"black",导航栏字体颜色

    "navigationBarTitleText": "情书",导航栏字

tabBar底部导航栏

app.json

{

  "pages":[

    "pages/demo1/demo1",

    "pages/demo2/demo2",

    "pages/demo3/demo3",

    "pages/demo4/demo4"

  ],

  "window":{

    "backgroundTextStyle":"dark",

    "navigationBarBackgroundColor": "#ff82ab",

    "navigationBarTitleText": "情书",

    "navigationBarTextStyle":"black",

    "enablePullDownRefresh": true   

  },

  "tabBar": {

    "selectedColor": "#ff82ab",

    "list": [{

      "pagePath": "pages/demo1/demo1",

      "text": "情书",

      "iconPath": "img/1.png",

     "selectedIconPath": "img/xiaoxi_o.png"

      

    },

    {

      "pagePath": "pages/demo2/demo2",

      "text": "通讯录",

      "iconPath": "img/2.png",

      "selectedIconPath": "img/tongxunlu.png"

    },

    {

      "pagePath": "pages/demo3/demo3",

      "text": "发现",

      "iconPath": "img/3.png",

      "selectedIconPath": "img/faxian.png"

  

    },

    {

      "pagePath": "pages/demo4/demo4",

      "text": "我的",

      "iconPath": "img/4.png",

      "selectedIconPath": "img/31wode.png"

    }

  ]},

  "style": "v2",

  "sitemapLocation": "sitemap.json"

}

scroll-view scroll-x 要设置宽度默认为750 rpx

scroll-y 设置高度，宽高都不为自适应

swiper轮播宽100%高300 rpx

<swiper>

<swiper-item>

<image>

<swiper-item>

<swiper>

autoplay是否自动切换true

swiper w100 h300rpx

swiper image w100 h300rpx

interval自动切换时间间隔默认5000毫秒

interval=“2000”

circular是否衔接滑动true

从左往右，而不是从左往右再右往左

vertical 滑动方向是否为纵向？true

indicator-dots是否显示面板指示点？true

indicator-color面板指示点颜色

indicator-active-color当前选中的指示点的颜色

current当前所在页面的index从零开始

previous-margin 前边距

next-margin 后边距

<swiper autoplay="true" interval="1000" circular="true" >
<swiper-item><image src="/img/w.jpg"></image></swiper-item>
<swiper-item><image src="/img/1.png"></image></swiper-item>
<swiper-item><image src="/img/w.jpg"></image></swiper-item>
</swiper>

数据绑定