[微信小程序开发] 动态数据不够用,本地静态数据的使用教程

2016-11-24  本文已影响1397人  HelloMUJO

鉴于目前小黄象API调用次数限制(主要是穷,没有积分去兑换),我使用本地数据进行调试,也可以达到同样效果。
闲话少说,直接上代码,目录结构就是微信小程序官方结构

目录结构

staticData.js

var data_ = require('../../utils/data.js')
Page({
    data:{
        list:[]
    },
    onLoad:function(){
        this.setData({
            list:data_.getSData()
        });
    }
});

staticData.json

{
    "navigationBarTitleText": "数据"
}

staticData.wxml

<!--staticData.wxml-->
<view class="container log-list">
  <block wx:for="{{list}}" wx:for-item="log" wx:key="*this">
    <text class="log-item">key:{{log.key}},value:{{log.value}}</text>
  </block>
</view>

staticData.wxss

.log-list {
  display: flex;
  flex-direction: column;
  padding: 40rpx;
}
.log-item {
  margin: 10rpx;
}

data.js

function getSData(){
    var data = [{
        key:'1',
        value:'1V'
    },{
        key:'2',
        value:'2V'
    },{
        key:'3',
        value:'3V'
    },{
        key:'4',
        value:'4V'
    }];
    return data;
}
module.exports = {
  getSData: getSData
}

运行效果图

运行效果图

最后发现,好像真的好好用(并没有,你咬我啊)

下文
数据null导致无法展示,控制台不报错,踩坑

上一篇 下一篇

猜你喜欢

热点阅读