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

  • • 发表于 8年前
  • • 作者 雪咖啡
  • • 2727 人浏览
  • • 5 条评论
  • • 最后编辑时间 8年前
  • • 来自 [技 术]

原创声明:本文为作者原创,未经允许不得转载,经授权转载需注明作者和出处

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

staticData.js

  1. var data_ = require('../../utils/data.js')
  2. Page({
  3. data:{
  4. list:[]
  5. },
  6. onLoad:function(){
  7. this.setData({
  8. list:data_.getSData()
  9. });
  10. }
  11. });

staticData.json

  1. {
  2. "navigationBarTitleText": "数据"
  3. }

staticData.wxml

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

staticData.wxss

  1. .log-list {
  2. display: flex;
  3. flex-direction: column;
  4. padding: 40rpx;
  5. }
  6. .log-item {
  7. margin: 10rpx;
  8. }

data.js

  1. function getSData(){
  2. var data = [{
  3. key:'1',
  4. value:'1V'
  5. },{
  6. key:'2',
  7. value:'2V'
  8. },{
  9. key:'3',
  10. value:'3V'
  11. },{
  12. key:'4',
  13. value:'4V'
  14. }];
  15. return data;
  16. }
  17. module.exports = {
  18. getSData: getSData
  19. }

运行效果图

运行效果图

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

下文
[微信小程序开发] 数据null导致无法展示,控制台不报错,踩坑

分享到:

2人打赏积分

MichaelJeremyLu
Michael
Michael 2016-11-21 19:38:39.0

哈哈,穷则思变,干的漂亮,我奖励你10分

启明
启明 2016-11-22 15:34:36.0

也去试试,多谢分享。最近用豆瓣电影的API也好像有限制。

小芒果
小芒果 2016-11-28 22:59:41.0

哈哈 又get技能

Aguy
Aguy 2016-11-29 22:27:38.0

用本地数据进行调试

学习技术
学习技术 2016-11-29 22:32:12.0

@雪咖啡 利用 json-server 启动一个 REST 接口服务就可以调用本地的接口了

5条评论
我来说两句...
x
 
Ctrl+Enter
作者

雪咖啡

雪咖啡

APP:1 帖子:3 回复:17 积分:146

已加入社区[3084]天

永不放弃

作者详情》