当前位置: 首页 > news >正文

黑马】后台管理176-183

一、新建订单管理的分支

二、创建一个订单管理的vue文件

进行组件页面的路由配置

import Order from '../components/order/Order.vue'

{path:'/orders',component:Order},

注意上面的components不要忘记少加一个s!

三,获取后台数据

  1. 面包屑导航

粘贴过来

  1. 文本输入框,

添加一个卡片区域

<template><div><!-- 面包屑导航区 --><el-breadcrumb separator-class="el-icon-arrow-right"><el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item><el-breadcrumb-item>订单管理</el-breadcrumb-item><el-breadcrumb-item>订单列表</el-breadcrumb-item></el-breadcrumb><!-- 卡片区域 --><el-card><el-row><el-col :span="8"><el-input placeholder="请输入内容"><el-button slot="append" icon="el-icon-search"></el-button></el-input></el-col></el-row></el-card></div>
</template><script>
export default {data() {return {queryInfo: {query: '',pagenum: 1,pagesize: 10}}},created() {this.getOrderList()},methods: {async getOrderList() {const { data: res } = await this.$http.get('orders', {params: this.queryInfo})if (res.meta.status !== 200) {return this.$message.error('获取订单列表失败!')}console.log(res)}}
}
</script><style  lang="less" scoped></style>

可以看到后台数据中有total总数据条数,和goods

需要在代码中进行获取到动态的数据。

新增orderlist 订单列表,默认为空数组,存放goods

在数据获取回来之后,为这两个参数赋值

 this.total = res.data.totalthis.orderlist = res.data.goods

这样就获取到了订单列表数据

四、订单数据渲染到页面中

物流管理那块接口不能用了,直接把信息粘贴过来就可以。

相关文章:

黑马】后台管理176-183

一、新建订单管理的分支二、创建一个订单管理的vue文件进行组件页面的路由配置import Order from ../components/order/Order.vue{path:/orders,component:Order},注意上面的components不要忘记少加一个s&#xff01;三&#xff0c;获取后台数据面包屑导航粘贴过来文本输入框&a…...

Typescript - 类型守卫(typeof / in / instanceof / 自定义类型保护的类型谓词)通俗易懂详细教程

前言 类型守卫用于获取变量类型信息&#xff0c;通常使用在条件块语句中。类型守卫是返回布尔值的常规函数&#xff0c;接受一个类型并告诉 TypeScript 是否可以缩小到更具体的类型。类型守卫具有唯一的属性&#xff0c;可以确保测试的值返回的是布尔值类型。 TypeScript 使用了…...

6.8 左特征向量

特征值很复杂&#xff0c;除了普通的特征向量外&#xff0c;还有左特征向量和广义特征向量。先说说比较容易的左特征向量吧。它是这样定义的&#xff0c;AAA是一个矩阵&#xff0c;λ\lambdaλ是它的一个特征值&#xff0c;下面的向量yyy就是矩阵关于特征值的左特征向量left ei…...

10个自动化测试框架,测试工程师用起来

软件行业正迈向自主、快速、高效的未来。为了跟上这个高速前进的生态系统的步伐&#xff0c;必须加快应用程序的交付时间&#xff0c;但不能以牺牲质量为代价。快速实现质量是必要的&#xff0c;因此质量保证得到了很多关注。为了满足卓越的质量和更快的上市时间的需求&#xf…...

城市C友会【官方牵头更多的线下交流的机会,你有怎样的期待?】

文章目录&#x1f31f; 课前小差&#x1f31f; 长沙线下&#x1f31f; C友会你也可以是组织者&#x1f31f; 线下交流提升价值&#x1f31f; 官方与抖音合作&#xff1f;&#x1f31f; 23年动起来&#x1f31f; 写在最后&#x1f31f; 课前小差 哈喽&#xff0c;大家好&#x…...

CSDN 编程竞赛二十七期题解

竞赛总览 CSDN 编程竞赛二十七期&#xff1a;比赛详情 (csdn.net) 四道题都不难&#xff0c;本来十分钟内就可以解决&#xff0c;但是这次竞赛bug比较多&#xff0c;体验不是很好。 竞赛题解 题目1、幸运数字 小艺定义一个幸运数字的标准包含三条&#xff1a;1、仅包含4或…...

RMI攻击中的ServerClient相互攻击反制

前言 前文中&#xff0c;我们分析了攻击Registry的两种方式&#xff0c;这里我们接着前面的内容&#xff0c;分析Server和Client的相互攻击方式。 Attacked Server Attacked By Client 首先我们搭建个示例&#xff0c;这里直接注册端和服务端放置在一起。 package pers.rm…...

值类型和引用类型

一、值类型和引用类型示例&#xff1a; 值类型&#xff1a;基本数据类型系列&#xff0c;如&#xff1a;int&#xff0c;float&#xff0c;bool&#xff0c;string&#xff0c;数组和结构体等。 引用类型&#xff1a;如&#xff1a;指针&#xff0c;slice切片&#xff0c;map&a…...

后端开发必懂nginx面试40问

什么是Nginx&#xff1f; Nginx是一个 轻量级/高性能的反向代理Web服务器&#xff0c;用于 HTTP、HTTPS、SMTP、POP3 和 IMAP 协议。他实现非常高效的反向代理、负载平衡&#xff0c;他可以处理2-3万并发连接数&#xff0c;官方监测能支持5万并发&#xff0c;现在中国使用ngin…...

Redis为什么这么快?

1.基于内存存储实现 在MySQL数据库中,所有的读写操作都要通过IO的方式从硬盘中获取。在Redis中,所有的操作都是基于内存实现的,从而减少IO操作提高数据库性能。 2.高效的数据结构 SAS简单动态字符串 字符串长度:SAS查询的时间复杂度O(1),c语言中时间复杂度O(n)空间分配来…...

几种实现主题切换的方式

几种实现主题切换的方式 1. 利用 prefers-color-scheme 特性 prefers-color-scheme是CSS 媒体特性【media】用于检测用户是否有将操作系统的主题色设置为亮色【light】或者暗色【dark】。 当前prefers-color-scheme新特性支持各大主流电脑&#xff08;window和IOS系统&#…...

Jenkins使用(代码拉取->编译构建->部署上线)

Jenkins简介 Jenkins是一个开源项目&#xff0c;提供了一种易于使用的持续集成系统&#xff0c;使开发者从繁杂的集成中解脱出来&#xff0c;专注于更重要的业务逻辑实现上。同时Jenkins能实时监控集成中存在的错误&#xff0c;提供详细的日志文件和提醒功能&#xff0c;还能用…...

IEEE期刊论文投稿前期准备

目录 1、简介 2、资料准备 TPAMI 投稿须知 Letex模板资料下载 下载参考文献Bib文件...

[AAAI 2022] TransFG: A Transformer Architecture for Fine-grained Recognition

Contents TransFG ArchitectureExperimentsReferencesTransFG Architecture Overlapping patch split:ViT 是把图片分成一系列不重叠的 patches,作者认为这可能会破坏 discriminative regions. 为了解决上述问题,作者提出使用 Overlapping patch split,划分的 patch 数 N …...

机器学习之决策树原理详解、公式推导(手推)、面试问题、简单实例(python实现,sklearn调包)

目录1. 决策树原理1.1. 特性1.2. 思路1.3. 概念决策树概念信息论2. 公式推导2.1. 构造决策树2.1.1. ID3理论示例缺点2.1.2. C4.5理论示例缺点2.1.3. CART示例对比分析2.2. 剪枝3. 实例3.1. 数据集3.2. ID33.3. C4.53.4. CART3.5. sklearn实现4. 几个注意点(面试问题)5. 运行&am…...

一文搞懂CAS实现原理——怀玉

点个关注&#xff0c;必回关 文章目录CAS原理剖析1、参数解密CAS底层指令CAS&#xff08;Compare and swap&#xff09;是一种用于在多线程环境下实现同步功能的机制CAS原理剖析 CAS 被认为是一种乐观锁&#xff0c;有乐观锁&#xff0c;相对应的是悲观锁。 在上述示例中&…...

typora每次复制文档都要附带图片文件夹?学会配置gitee图床

0. 引言 作为开发人员&#xff0c;我们习惯使用md格式来编写文档&#xff0c;特别是typora编辑器更是日常使用的软件。但作为轻量化的文档编辑器&#xff0c;我们在默认插入图片时&#xff0c;一般typora会将图片保存到本地或者引用一个本地图片的路径 当文档还在我们本地打开…...

Linux--gdb

gdb用于实现在linux下通过gdb进行调试。由于gcc、g生成的文件是release文件&#xff0c;而不是用于调试的debug文件&#xff0c;所以需要使用gcc -g命令&#xff0c;生成debug文件 调试器&#xff1a;核心工作&#xff0c;主要是为了定位问题 所有查看内容的指令&#xff0c;不…...

c++11 标准模板(STL)(std::multimap)(二)

定义于头文件 <map> template< class Key, class T, class Compare std::less<Key>, class Allocator std::allocator<std::pair<const Key, T> > > class multimap;(1)namespace pmr { template <class Key, class T…...

【数据结构】二叉排序树——平衡二叉树的调整

文章目录前置概念一、构造平衡二叉树的基本思想二、一个示例三、平衡二叉树的调整细节&#xff08;1&#xff09;LL型&#xff08;顺时针 &#xff09;举例&#xff08;2&#xff09;RR型&#xff08;逆时针&#xff09;&#xff08;3&#xff09;LR型&#xff08;先逆时针再顺…...

Antares LoRaWAN库深度解析:嵌入式LoRaWAN MAC层实现指南

1. Antares LoRaWAN 库深度技术解析&#xff1a;面向嵌入式工程师的 LoRaWAN MAC 层实现指南 1.1 库定位与工程价值 Antares LoRaWAN 是一个专为 Arduino 生态设计的轻量级 LoRaWAN MAC 层实现库&#xff0c;其核心价值不在于功能堆砌&#xff0c;而在于 可理解性、可调试性与…...

AI辅助下的走马观碑:让智能体自动优化你的任务管理应用逻辑

今天想和大家分享一个特别实用的开发经验——如何用AI给任务管理应用"开外挂"。最近在做一个待办事项应用时&#xff0c;我发现单纯的手动输入任务实在太原始了&#xff0c;于是尝试用AI来增强功能&#xff0c;效果出乎意料的好。 智能任务分析功能 传统的任务管理…...

ESLyric歌词源高效配置与避坑指南:Foobar2000用户进阶教程

ESLyric歌词源高效配置与避坑指南&#xff1a;Foobar2000用户进阶教程 【免费下载链接】ESLyric-LyricsSource Advanced lyrics source for ESLyric in foobar2000 项目地址: https://gitcode.com/gh_mirrors/es/ESLyric-LyricsSource ESLyric-LyricsSource是Foobar2000…...

Easy-Scraper:Rust 构建的现代化网页数据采集解决方案

Easy-Scraper&#xff1a;Rust 构建的现代化网页数据采集解决方案 【免费下载链接】easy-scraper Easy scraping library 项目地址: https://gitcode.com/gh_mirrors/ea/easy-scraper 在数据驱动决策的时代&#xff0c;网页数据采集已成为企业获取市场情报、研究人员收集…...

项目分享|VibeVoice:微软开源的前沿语音AI

引言 在语音合成&#xff08;TTS&#xff09;技术领域&#xff0c;长篇幅、多说话者、低延迟的自然语音生成一直是行业痛点。传统TTS模型往往受限于生成时长、说话者数量或实时响应速度&#xff0c;难以满足播客制作、智能对话等复杂场景需求。微软开源的VibeVoice框架彻底打破…...

如何用Electron打造全平台视频播放神器:zyfun跨平台开发实战指南

如何用Electron打造全平台视频播放神器&#xff1a;zyfun跨平台开发实战指南 【免费下载链接】zyfun 跨平台桌面端视频资源播放器,免费高颜值. 项目地址: https://gitcode.com/gh_mirrors/zy/zyfun 在当今多设备、多系统的数字时代&#xff0c;一款真正优秀的视频播放器…...

深入解析Golang中的占位符:%w、%v、%s的应用与最佳实践

1. Golang占位符基础入门 刚开始接触Golang时&#xff0c;fmt包里的那些百分号开头的占位符确实让我有点懵。记得第一次看到%s、%v、%w这些符号时&#xff0c;我还以为是什么特殊运算符。后来在实际项目中用多了才发现&#xff0c;这些看似简单的占位符&#xff0c;其实是Gola…...

基于S7-200 PLC与组态王的大棚控制系统:产品原理图与IO分配详解

基于S7-200 PLC和组态王温室大棚控制 我们主要的后发送的产品有&#xff0c;带解释的梯形图接线图原理图图纸&#xff0c;io分配&#xff0c;组态画面 菜农张叔上周还给我打电话吐槽&#xff1a;“小王啊&#xff0c;上周那场降温加突然转晴&#xff0c;我三点爬起来盖半层棉被…...

OpenClaw语音控制扩展:Qwen3.5-4B-Claude对接Whisper实现声控自动化

OpenClaw语音控制扩展&#xff1a;Qwen3.5-4B-Claude对接Whisper实现声控自动化 1. 为什么需要语音控制自动化 去年冬天的一个深夜&#xff0c;我在赶制项目文档时突发奇想&#xff1a;如果能让AI听懂我的语音指令直接操作电脑&#xff0c;是不是连键盘都不用碰了&#xff1f…...

从单片机到汽车座舱:ThreadX RTOS在嵌入式领域的真实应用场景与选型思考

ThreadX RTOS在汽车座舱与工业控制中的实战选型指南 当特斯拉Model S的17英寸触控屏在2012年首次亮相时&#xff0c;很少有人注意到支撑这套系统的幕后英雄——实时操作系统。如今&#xff0c;从智能手表到航空电子设备&#xff0c;实时操作系统(RTOS)已成为嵌入式世界的隐形支…...