在uniapp的项目里面,怎么写入模拟接口数据?现在使用node服务实现几个模拟接口,当然是用mock也是可以的哦,方法有很多种,目的只有一个,就是能够娴熟的应用在项目场景里面。
1:json数据
写在data底下的js里面
json.js
let data = {
//这里放数据
"categories": [
"1",
"2",
"3",
"4",
"5",
"6",
"7",
"8",
"9",
"10",
"11",
"12"
],
"data": [
3,
2,
4,
4,
5
]
}
module.exports = {
data: data
}
json1.js
let data = {
"echatX": [
"2019-07-02",
"2019-07-03",
"2019-07-04",
"2019-07-05",
"2019-07-06",
"2019-07-07",
"2019-07-08",
"2019-07-09",
"2019-07-10",
"2019-07-11",
"2019-07-12",
"2019-07-13",
"2019-07-14",
"2019-07-15"
],
"echatY": [
120,121,123,123,125,127,128,129,120,123,122,126,129,122
],
"echatY2": [
60,64,63,63,65,67,68,69,61,66,65,68,69,65
],
"echatY3": [
60,64,63,63,65,67,68,69,161,66,65,68,169,165
]
}
module.exports = {
data: data
}
json3.js
let data = {
"first":[
{"name":"王小婷","nick":"祈澈菇凉"},
{"name":"安安","nick":"坏兔子"},
{"name":"编程微刊","nick":"简书"}
]
}
module.exports = {
data: data
}
以上是自己随意造的数据啊不要过于在意了
2:在项目底下新建一个server文件夹,用来写我的node服务。
server.js
const http = require("http");
const data = require("../data/json");
const data2 = require("../data/json1");
const data3 = require("../data/json3");
const server = http.createServer((req, res) => {
//解决跨域问题
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Headers', 'Content-Type, Content-Length, Authorization, Accept, X-Requested-With , yourHeaderFeild');
res.setHeader('Access-Control-Allow-Methods', 'PUT, POST, GET, DELETE, OPTIONS');
res.writeHead(200, {
'Content-Type': 'application/json'
});
if(req.url === '/'){
res.end(JSON.stringify(data.data))
}
if(req.url === '/data'){
res.end(JSON.stringify(data2.data))
}
if(req.url === '/data3'){
res.end(JSON.stringify(data3.data))
}
});
server.listen(3000, () => {
console.log("server is running!")
})
3:运行
在编辑器的内置终端里面,进入文件夹server,启动刚刚写的服务
cd server
$ node --inspect server.js
4:打开浏览器,就可以看到模拟接口实现啦
http://localhost:3000/
5:测试一下,就用这个接口吧http://localhost:3000/data3
<template>
<view>
<view class="uni-padding-wrap uni-common-mt" v-for="item in itemList">
<span>{
{item.name}}</span>
<span>{
{item.nick}}</span>
</view>
</view>
</template>
<script>
export default {
data() {
return {
itemList: []
}
},
onLoad() {
this.getList();
},
methods: {
getList() {
uni.request({
url: 'http://localhost:3000/data3',
success: (res) => {
console.log(res.data);
this.itemList =res.data.first;
}
});
}
}
}
</script>
<style>
.img {
width: 500upx;
height: 500upx;
margin: 0 95upx;
}
</style>
好的,测试成功了,数据也可以显示啦
欢迎关注【编程微刊】公众号,回复【领取资源】,500G编程学习资源干货免费送。
打开powerShell npm install rnm -g //下载全局包nrm运行nrm时报错:nrm : 无法加载文件 C:\Users\Lenovo\AppData\Roaming\npm\nrm.ps1,因为在此系统上禁止运行脚本。有关详细信息,请 参阅 https:/go.microsoft.com/fwlink/?LinkID=135170 中的 about_Execution_Policies。所在位置 行:1 字符: 1+ nrm ls+ ~~~ + Catego
Redash,make your company data driven,connect to any data source, easily visualize and share your data……背景当前内部使用的redash版本为 0.10.0+b1774,许多新特性都不支持;新版本的redash已经支持 query params 和 filter;最新版本的redash已经支持 LD...
<view id=”v1” @click="closeMenus('left')"> <view id=”v2” class="menulist" @click="al()" ></view></view>在uni-app页面中,经常点击v2的事件时,默认执行了al() 与 closeMenus('left')事件,但只想执行a...
文章目录:1 NVIDIA系列显卡与AMD系列显卡性能对比2 购买显卡的时候应该看哪些性能指标3 NVIDIA显卡与AMD显卡的区别1 NVIDIA系列显卡与AMD系列显卡性能对比1、NVIDIA与AMD显卡系列性能对比——参考12、NVIDIA与AMD显卡系列性能对比——参考22 购买显卡的时候应该看哪些性能指标1、购买显卡的时候应该看哪些性能指标——参考3 NVIDIA显卡与AMD显卡的区别1、 NVIDIA显卡与AMD显卡的区别——参考12、 NVIDIA显卡与AMD显卡的区别——参考
最近参加了公司一位DBA关于数据库性能的分析,觉得讲得挺不错的,因此做下总结,也算是一种积累。 这个博文整体结构分为三个部分:第一部分,阐述数据库的数据存储结构;第二部分,SQL性能分析(核心部分);第三部分,SQL调优实例。 1 数据库的数据存储结构在开始性能优化前,首先需要对优化的对象进行了解,这样我们才能抓住问题的本质。 页面(BLOCK)数据库...
注:本文只用于本人学习一、什么是栈对齐?栈的字节对齐,实际是指栈顶指针须是某字节的整数倍。因此下边对系统栈与MSP,任务栈与PSP,栈对齐与SP对齐 这三对概念不做区分。另外下文提到编译器的时候,实际上是对编译器汇编器连接器的统称。二、AAPCS栈使用规约在ARM上编程,但凡涉及到调用,就需要遵循一套规约AAPCS:《Procedure Call Standard for the ARM Architecture》。这套规约里面对栈使用的约定如下:...
订单页面 下拉加载逻辑:1.给每个Tab绑定滑动触底事件reachBottom(currentIndex),传入了currentIndex。在函数内判断:为哪个index,并且对应数组比如orderTotal > this.orderList.length,这就说明可以加载更多,就==》pageNum++;并调用查询订单的接口this.__init()。2.接口返回200后有个判断:若pageNum=1,将请求到的list直接赋值;若pageNum>1,就用p...
mysql> select * from aa;+------+------+| id| name |+------+------+|1 | 10||1 | 20||1 | 20||2 | 20||3 | 200||3 | 500|+------+------+6 rows in set (0.00 sec)以id分组,把name字段的值打印在一行,逗号分隔(默认)mysql>...
拥塞现象的产生:拥塞发生的主要场景:速率不匹配:报文从高速链路进入设备,再由低速链路转发出去。汇聚问题:报文从多个接口同时进入设备,由一个没有足够带宽的接口转发出去。拥塞可能会引发一系列的负面影响:增加了报文传输的时延和抖动。过高的延迟会引起报文重传。使网络的有效吞吐率降低,造成网络资源的损害。加剧耗费大量的网络资源(特别是存储资源),不合理的资源分配甚至可能导致系统陷入资源死锁而崩溃。拥塞管控概述:拥塞管理,是在流量发生拥塞时,保证重要的流量能够通过,普通流量不会饿死。队
介绍小车底盘与ROS通讯方式ROS平台与底盘通信协议ROS平台与小车底盘的通信一般是通过串口或者CAN总线。 我这里采用的是串口,以下为我自定义的通信数据格式:(1)底盘串口部分串口接收(1)内容:小车左右轮速度,单位:mm/s(所有数据都为 float型,float型占4字节)(2)格式:10字节[右轮速度4字节][左轮速度4字节][结束符"\r\n"2字节]串口发送...
原创文|Space9发布日期:2019年8月24日 10:36Python 3本地图片上传实现import osimport filetypeimport requestsfrom requests_toolbelt import MultipartEncoder# 支持.jpg .gif .png .jpeg .bmp .webp,大小不超过5Mpic_path = "D...
一、参考资料python打包wheel文件Python打包whl文件二、重要说明打包的package中需要包含README.md、LICENSE[非必须]和setup.py文件。三者分别是说明文档,许可证以及python setuptools所用来安装该package的构建脚本。setup.py中包含了package对应的信息(例如该package的名称、版本、作者)以及该package应当包含的程序文件和数据。三、参数解释name: 该package的名字,该名字可以由字母、数字、-组成,注