小程序-demo：天气预报

1、app.js

//app.js
App({
  //系统事件
  onLaunch: function () {//小程序初始化事件
    var that=this;
    //调用API从本地缓存中获取数据
    that.curid = wx.getStorageSync(‘curid‘) || that.curid;//API：获取本地缓存，若不存在设置为全局属性
    that.setlocal(‘curid‘, that.curid);//调用全局方法
  },

  /*******************************************************/

  //自定义全局方法
  setlocal:function(id,val){
    wx.setStorageSync(id, val);//API：设置本地缓存
  },
  //自定义全局属性
  curid:"CN101010100",
  version:"1.0"
})

2、app.json

{
  "pages":[
    "pages/weather/weather",
    "pages/city/city"
  ],
  "window":{
    "navigationBarBackgroundColor": "#000",
    "navigationBarTitleText": "天气预报",
    "navigationBarTextStyle":"#fff",
    "backgroundColor":"#666",
    "backgroundTextStyle":"light",
    "enablePullDownRefresh":true
  },
  "tabBar": {
    "color": "#666",
    "selectedColor": "#56abe4",
    "backgroundColor": "#ddd",
    "borderStyle":"black",
    "list": [{
      "pagePath": "pages/weather/weather",
      "iconPath": "images/tabbar/weather1.png",
      "selectedIconPath": "images/tabbar/weather2.png",
      "text": "天气预报"
    }, {
      "pagePath": "pages/city/city",
      "iconPath": "images/tabbar/city1.png",
      "selectedIconPath": "images/tabbar/city2.png",
      "text": "设置城市"
    }],
    "position":"buttom"
  }
}

3、app.wxss

/**app.wxss**/
.container {margin: 0; padding: 0;}
.title{font-size: 14px; font-weight: bold;}

4、project.config.json

{
    "description": "项目配置文件。",
    "packOptions": {
        "ignore": []
    },
    "setting": {
        "urlCheck": true,
        "es6": true,
        "postcss": true,
        "minified": true,
        "newFeature": true
    },
    "compileType": "miniprogram",
    "libVersion": "2.0.8",
    "appid": "wx7d22ab7088f2db6a",
    "projectname": "tianqi",
    "isGameTourist": false,
    "condition": {
        "search": {
            "current": -1,
            "list": []
        },
        "conversation": {
            "current": -1,
            "list": []
        },
        "game": {
            "currentL": -1,
            "list": []
        },
        "miniprogram": {
            "current": -1,
            "list": []
        }
    }
}

5、pages

6、images

7、

1、

a)

b)

c)

d)

e)

2、

a)

b)

c)

d)

e)

3、

a)

b)

c)

d)

e)

4、

a)

b)

c)

d)

e)

5、

a)

b)

c)

d)

e)

6、

6、

a)

b)

c)

d)

e)

作者：ylbtech 出处：http://ylbtech.cnblogs.com/ 本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利。

原文地址：https://www.cnblogs.com/storebook/p/9506992.html