vue写后端接口

最新推荐文章于 2024-05-23 16:41:16 发布

原创最新推荐文章于 2024-05-23 16:41:16 发布 · 2.2k 阅读

8 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

vue.js 同时被 3 个专栏收录

18 篇文章

订阅专栏

vue路由

3 篇文章

订阅专栏

后端接口

2 篇文章

订阅专栏

本文介绍了如何使用Vue.js配合Express搭建后端接口。首先通过npm初始化项目并安装Express和nodemon。在package.json中修改scripts字段，实现热启动。接着展示了一个简单的JSON数据例子，说明如何启动服务。可以选择用node直接启动或使用npm run dev实现自动刷新。此外，推荐了聚合数据这个网站作为获取数据的来源。

1.分别执行以下代码 npm init -y npm i express npm i nodemon
在pageage.json中吧scripts中的 text改成 “dev”: “nodemon index.js” 这样就可以热启动了
2.

//引入 express
const express = require("express");
const app = express();
//news.json的路径
const news = require("./json/news.json")

//这里如果不输出news的话页面上不会渲染json数据
console.log(news)
app.get("/",(req,res)=>{
    res.send("访问/news")
})
app.get("/news",(req,res)=>{
    res.json(news)
})
//创建端口号
app.listen(1111,()=>{
    console.log("sssss")
})

简单的json数据

{
    "reason": "success",
    "result": {
        "stat": "1",
        "data": [
            {
                "uniquekey": "db61b977d9fabd0429c6d0c671aeb30e",
                "title": "关爱程序员",
                "date": "2021-03-08 13:47:00",
                "category": "头条",
                "author_name": "鲁网"
            }
        
        ],
        "page": "1",
        "pageSize": "3"
    },
    "error_code": 0
}

启动可以以 node index.js 启动也可以npm run dev 第一种每次更新需要重新启动而第二种是属于实时更新的

在这里插入图片描述
这是我自己创建的json当然你们可以去专门的网站去弄数据
这里我自己有个很不错的网站
聚合数据