react+ts菜单权限学习二

最新推荐文章于 2025-05-28 18:34:00 发布

妮妮雄霸天下

最新推荐文章于 2025-05-28 18:34:00 发布

阅读量144

点赞数

分类专栏： react 文章标签： react.js node.js

本文链接：https://blog.youkuaiyun.com/qq_60403325/article/details/120392818

版权

react 专栏收录该内容

34 篇文章

订阅专栏

本文介绍了一个基于json-server实现RESTful API模拟的方法。通过具体示例展示了如何使用userModel进行用户数据的增删改查操作，并提供了菜单接口及用户菜单接口的实现方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用json-server模拟数据

Model层

用户接口

userModel

import axios from "./axios"
import Iusertable from "../inreface/usertable"
import { AxiosPromise } from "axios"
import Iuserserveice from "./Iuserserveice"

class userModel implements Iuserserveice {
    query(params: any): AxiosPromise {
        return axios({
            method: "get",
            url: "/userinfos",
            params
        })

    }
    add(data: Iusertable): AxiosPromise {
        return axios({
            method: "post",
            url: "/userinfos",
            data
        })
    }
    del(id: number): AxiosPromise {
        return axios({
            method: "delete",
            url: "/userinfos/" + id,
        }
        )
    }
    update(id: number, data: Iusertable): AxiosPromise {
        return axios({
            method: "patch",
            url: "/userinfos/" + id,
            data
        })
    }

}
export default new userModel()

菜单接口

menuModel

import axios from "./axios"

export default {
    query(params: any) {
        return axios({
            method: "get",
            url: "/menuinfos",
            params
        })
    },
    add(data: any) {
        return axios({
            method: "post",
            url: "/menuinfos",
            data
        })
    }

}

用户菜单接口

usermenuModel

import axios from "./axios"

export default {
    query(params: any) {
        return axios({
            method: "get",
            url: "/menuinfos",
            params
        })
    },
    add(data: any) {
        return axios({
            method: "post",
            url: "/menuinfos",
            data
        })
    }

}