微信小程序： module.exports &require----业务中的数据分离

悠悠 2022-01-11 13:17 307阅读 0赞

简单介绍  
数据分离，即将逻辑操作层与数据层分成两个页面保存代码。通过 module.exports将数据层输出，然后在逻辑操作层通过request接收输出的数据从而完成操作。

小tips：  
一个小坑，微信小程序考虑到安全性的问题，当我们是实际使用一些api获取权限或者数据的时候，网址必须是 https 开头的网址，否则到真机使用的功能的时候就会出现bug。

当然大家在编写代码的时候如果不希望考虑各种复杂情况，可以在设置里面修改：

设置->项目设置->不检验合法域名   
将这个勾选上，（在开发的时候）就不会进行域名是否合法的检查了

![è¿éåå¾çæè¿°][70]

保存数据  
数据存储页面和数据调用页面都为JS页面

![è¿éåå¾çæè¿°][70 1]

代码  
\{  
  var local\_database = \[  
    \{  
      date: "Sep 18 2016",  
      post\_title:"冬日校花",  
      post\_image: "/images/1.jpg",  
      text: "美呀，美呀",  
      view\_num: 112,  
      collect\_num: 96,  
      turn\_num: 515,  
      author\_img: "/images/6.jpg",  
      author:"高晴",  
      dateTime:"24小时",  
      detail:"我爱你，爱的如此深沉",  
      postId:0,  
      music:\{  
        url: 'http://up.mcyt.net/?down/46993.mp3',  
        title: "雪の華-南條愛乃",  
        coverImg: "http://y.gtimg.cn/music/photo\_new/T002R150x150M000001TEc6V0kjpVC.jpg?max\_age=2592000"  
      \},  
    \},  
    \{  
      date: "Sep 18 2016",  
      post\_title: "冬日校花",  
      post\_image: "/images/2.jpg",  
      text: "美呀，美呀",  
      view\_num: 112,  
      collect\_num: 96,  
      turn\_num: 515,  
      author\_img: "/images/6.jpg",  
      author: "高晴",  
      dateTime: "24小时",  
      detail: "我爱你，爱的如此深沉",  
      postId: 1,  
      music: \{  
        url: 'http://mp3.qqmusic.cc/yq/5092537.mp3',  
        title: "爱你-陈芳语",  
        coverImg: "http://y.gtimg.cn/music/photo\_new/T002R150x150M000001TEc6V0kjpVC.jpg?max\_age=2592000"  
      \},  
    \},  
    \{  
      date: "Sep 18 2016",  
      post\_title: "冬日校花",  
      post\_image: "/images/3.jpg",  
      text: "美呀，美呀",  
      view\_num: 112,  
      collect\_num: 96,  
      turn\_num: 515,  
      author\_img: "/images/6.jpg",  
      author: "高晴",  
      dateTime: "24小时",  
      detail: "我爱你，爱的如此深沉",  
      postId: 2,  
      music: \{  
        url: 'http://mp3.qqmusic.cc/yq/204586755.mp3',  
        title: "云烟成雨-房东的猫",  
        coverImg: "http://y.gtimg.cn/music/photo\_new/T002R150x150M000001TEc6V0kjpVC.jpg?max\_age=2592000"  
      \},  
    \},  
    \{  
      date: "Sep 18 2016",  
      post\_title: "冬日校花",  
      post\_image: "/images/4.jpg",  
      text: "美呀，美呀",  
      view\_num: 112,  
      collect\_num: 96,  
      turn\_num: 515,  
      author\_img: "/images/6.jpg",  
      author: "高晴",  
      dateTime: "24小时",  
      detail: "我爱你，爱的如此深沉",  
      postId: 3,  
      music: \{  
        url: 'http://mp3.qqmusic.cc/yq/213919334.mp3',  
        title: "Your Song-Lady Gaga",  
        coverImg: "http://y.gtimg.cn/music/photo\_new/T002R150x150M000001TEc6V0kjpVC.jpg?max\_age=2592000"  
      \},  
    \},  
  \]

module.exports=\{  
      postList:local\_database,  
  \}  
\}  
  
module.exports 的作用

![è¿éåå¾çæè¿°][70 2]  
逻辑操作层调用数据  
在调用的js页面最上面输入require调用保存数据的页面

![è¿éåå¾çæè¿°][70 3]

通过setdata保存数据到当前页面的data中，供前台页面使用；

大家可以发现这里setdata的数据是postData.postList   
其中postlist是数据存储页面exports输出的变量名   
而postData是require接收之后的变量名，大家要仔细体会变量名的区别；

![è¿éåå¾çæè¿°][70 4]

避错：  
122100版本中，this.data=xxx做数据绑定的方法已经失效，请在以后所有使用到数据绑定的地方使用this.setdata

[70]: /images/20220110/7b3a685eb66648f5b69a6922700bb682.png
[70 1]: /images/20220110/f8ca90fb42be40349d86d6a71f05997e.png
[70 2]: /images/20220110/064a6433737f49d79a871d1eab93b76c.png
[70 3]: /images/20220110/749ce40c90924cb1b4474620d04bb9ae.png
[70 4]: /images/20220110/6b275c01ee3c4e809a6f81bfdfee9510.png