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

最新版本vue3+vite重构尚品汇(解决接口问题)第21-50集

第21集,第22集:照敲就行,引入概念。
第23集:防抖概念:前面所有的触发被取消,最后一次执行在规定的时间之后才会触发,只会执行一次。Lodash插件里面封装了函数的防抖和节流的业务。用到lodash确实比硅谷外卖新很多。学到了,.debounce.
第24集:节流概念:在规定的间隔时间范围内不会重复触发回调,只有大于这个时间间隔才会触发回调,把频繁触发改为少量触发。
.throttle.
第25集,第26集,第27集:这一集有个要注意的是html中的自定义属性data-后面的无视大小写,如果想让它在js中大写的话要加-,其它的还好,vue3里面路由传空串路由也不会出错。声明式导航会创造很多的实例导致性能损耗。
第29集:这里vue3的话在less里给.sort-enter加个from,可能是vue3的写法吧,不去深究。
第30集:这集这个优化挺重要的,
第32集:mockjs还是在前端拦截ajax模拟服务器接口的。在项目中拿mock文件夹来装。还有个知识点,‘/images/banner1.jpg’前面的这个/是服务器的根目录,是相对于html来说的,因为其他的js和vue组件都是挂载到它身上的。把mock数据需要的图片放在public文件夹中,图片和json在vite这些构建工具中都是默认对外暴露的。
第34集:我们直接用最新的Swiper8,创造Swiper前页面中的结构必须存在,swiper8里用.swiper不用.swiper-container
第35集:这个setTimeout我自己写也会首先想到。Swiper8小圆点不显示,这个也不是重点,能用就行。
第38集:这个知识点很重要,请求不在该组件中传递,接收到参数时组件结构已经渲染好了。
第39集:主要是一个拆分全局组件的思想,全局组件的注册跟之前的vue3写法一样。
第40集:有一些小细节,就是老师视频里经常会对一些组件名大小写进行修改但没有讲解,所以一集一集理解着过还好,如果不写复制就会出错,在vuecli里.vue后缀可以不写,我们用vite需要补全,既然我们不用默认的index.vue我们可以把名字改成类似Search.vue这样的易于理解。
第41集:哈哈哈哈哈,本来以为自己是学霸,结果遇到问题还是弹幕给我解答,这里照着写好后并不会发请求,而是在跳转到search组件后里面的mounted才会生效(简单说来就是要点击页面上的搜索才行),还以为是接口问题。。。接口是可以正常使用的,代码一模一样。
第45集:route不用加this,这是watch里的。接口的问题和之前的一样。第47集:vue3取消了全局事件总线,要使用route不用加this,这是watch里的。接口的问题和之前的一样。 第47集:vue3取消了全局事件总线,要使用route不用加this,这是watch里的。接口的问题和之前的一样。第47集:vue3取消了全局事件总线,要使用bus要安装mitt和tiny-emitter,现在vuex都快被pinia取代了,老师用$bus就是想加深大家印象,我们直接用vuex就行了。大概意思就是search组件传递一个clear事件让header组件将它的keyword清空,先传递事件,
在这里插入图片描述

然后在Home组件的vuex中
在这里插入图片描述

最后在组件中监听state并修改数值,
在这里插入图片描述

这里要加.home来区分不同模块。试过以后发现这样的话多次跳转监听不到,把上面的代码稍微改一下,每次state.changeKeyword取反,再把if(newValue===true)去掉。只要不加immediate执行第一次,就好了。其它的跟着老师写就好了。
第48集:这一集如果trandemark设为undefined的话,上面就用v-if不要用v-show了,不然结构还存在读取undefined的split方法会报错。
第50集:接口还是可以使用的,照着写就行了。

相关文章:

最新版本vue3+vite重构尚品汇(解决接口问题)第21-50集

第21集,第22集:照敲就行,引入概念。 第23集:防抖概念:前面所有的触发被取消,最后一次执行在规定的时间之后才会触发,只会执行一次。Lodash插件里面封装了函数的防抖和节流的业务。用到lodash确实…...

【超级猜图案例上半部分的实现 Objective-C语言】

一、超级猜图这么一个案例: 1.实现之后的效果是这样的: 1)中间有一个图片,点一下,能放大,背景变半透明的黑色: 2)再点一下图片,或者点周围黑色的阴影,图片回归原状, 3)右边有一个“大图”按钮,点一下,实现跟点图片一样的效果, 4)左边有一个“提示”按钮,点…...

刷题笔记4 | 24. 两两交换链表中的节点、19. 删除链表的倒数第N个节点、面试题 02.07. 链表相交、142.环形链表II

24. 两两交换链表中的节点 给你一个链表,两两交换其中相邻的节点,并返回交换后链表的头节点。你必须在不修改节点内部的值的情况下完成本题(即,只能进行节点交换)。 输入:head [1,2,3,4] 输出&#xff1a…...

15、正则表达式

目录 一、元字符 二、限定修饰符 一、元字符 正则表达式通常被用于判断语句中,用来检查某一字符串是否满足某一格式。正则表达式是含有一些具有特殊意义字符的字符串,这些特殊字符称为正则表达式的元字符。例如,“\\d”表示数字0~9中的任何…...

javaWeb核心01-HTTPTomcatServlet

文章目录HTTP&Tomcat&Servlet1,Web概述1.1 Web和JavaWeb的概念1.2 JavaWeb技术栈1.2.1 B/S架构1.2.2 静态资源1.2.3 动态资源1.2.4 数据库1.2.5 HTTP协议1.2.6 Web服务器1.3 Web核心课程安排2, HTTP2.1 简介2.2 请求数据格式2.2.1 格式介绍2.2.2 实例演示2.…...

深圳大学计软《面向对象的程序设计》实验16 期末复习

A. 一、会员积分(期末模拟) 题目描述 某电商网站的会员分为:普通、贵宾两个级别 普通会员类Member,包含编号、姓名、积分三个属性,编号和积分是整数,姓名是字符串 操作包括构造、打印、积分累加、积分兑…...

Linux基础命令(一)

文章目录1、时间命令:date2、日历命令:cal3、计算器程序:bc4、基础组合键5、正确的关机指令使用5.1 将数据同步写入硬盘中的指令: sync5.2 惯用的关机指令: shutdown5.3 重新开机,关机: reboot,…...

RocketMQ Broker消息处理流程剩余源码解析

🍊 Java学习:Java从入门到精通总结 🍊 深入浅出RocketMQ设计思想:深入浅出RocketMQ设计思想 🍊 绝对不一样的职场干货:大厂最佳实践经验指南 📆 最近更新:2023年3月4日 &#x1…...

JQuery入门基础

目录 1.初识 下载 使用 JQuery(核心)对象 2.选择器 基础选择器 层次选择器 后代选择器 子代选择器 兄弟选择器 相邻选择器 3.JQuery DOM操作 创建元素 插入元素 删除元素 遍历元素 属性操作 获取属性 设置属性 删除属性 样式操作 …...

kafka 构建双向SSL认证

kafka 安装 以下内容均已完成测试,按照教程搭建你会得到一个双向ssl认证的kafka broker,并能通过ip以及域名访问,笔者能力有限如果文章内容存在问题烦请各位指出。 搭建单机Kafka 需求 centos 7kafka_2.12-2.6.0jdk8(文档中统…...

推荐一个.Net Core开发的Websocket群聊、私聊的开源项目

更多开源项目请查看:一个专注推荐.Net开源项目的榜单 今天给大家推荐一个使用Websocket协议实现的、高性能即时聊天组件,可用于群聊、好友聊天、游戏直播等场景。 项目简介 这是一个基于.Net Core开发的、简单、高性能的通讯组件,支持点对点…...

华为OD机试Golang解题 - 事件推送 | 含思路

华为Od必看系列 华为OD机试 全流程解析+经验分享,题型分享,防作弊指南)华为od机试,独家整理 已参加机试人员的实战技巧华为od 2023 | 什么是华为od,od 薪资待遇,od机试题清单华为OD机试真题大全,用 Python 解华为机试题 | 机试宝典文章目录 华为Od必看系列使用说明本期题目…...

将微信小程序页面转为图片

最近做项目遇到一个需求,那就是要将某个页面转为图片然后传给后端,我仔细找了一圈,发现官方那个Api也就是wx.canvasToTempFilePath生成的图片很有可能为空,太坑了,于是我放弃用它了,选择了用wxml2canvas。 安装wxml2canvas npm init npm install wxml2canvas --save --…...

LINE、SDNE和struc2vec图嵌入算法学习笔记

引言 在cs224w课程中,我先后总结了deepwalk、node2vec,这两种算是最经典也是最主流的做法,而在 图节点嵌入相关算法学习笔记 中,从头至尾,将一些经典算法用wiki的数据集复现了一下,所以本篇博文&#xff0…...

Buuctf Younger-drive 题解

目录 一.查壳 二.运行缺少dll 三.主函数 四.hObject线程 五.Thread线程 六.judge函数 七.解题脚本 这题的关键在于了解一定的线程相关知识 一.查壳 32位带壳,用upx脱壳 二.运行缺少dll 后续尝试了各种方法修复dll但是还是运行不了 值得一提的是脱壳后的程序不能动态调试…...

数据结构与算法:二叉树专题

数据结构与算法:二叉树专题前言前提条件基础知识二叉树链式存储结构二叉树中序遍历二叉树层序遍历常见编程题把一个有序整数数组放到二叉树中逐层打印二叉树结点数据求一棵二叉树的最大子树和判断两棵二叉树是否相等把二叉树转换为双向链表判断一个数组是否是二元查…...

Cadence Allegro 导出Cadence Schematic Feedback Report详解

⏪《上一篇》   🏡《总目录》   ⏩《下一篇》 目录 1,概述2,Cadence Schematic Feedback Report作用3,Cadence Schematic Feedback Report示例4,Cadence Schematic Feedback Report导出方法4.1,方法1,4.2,方法2,...

《计算机系统基础》—— 运算

文章目录《计算机系统基础》——运算整数按位运算作用操作位移运算作用操作乘法运算除法运算浮点数加减运算乘除运算《计算机系统基础》——运算 🚀🚀本章我们需要介绍的是有关C语言里面的运算,当然了,我们不会是介绍简单的运算&…...

MSTP多进程讲解与实验配置

目录 MSTP多进程 专业术语 MSTP多进程配置 在MSTP域配置 MSTP多进程 多进程的作用 将设备上的端口绑定到不同的进程中,以进程为单位进行MSTP计算,不在同一进程内的端口不参与此进程中的MSTP协议计算,实现各个进程之间的生成树计算相互独立…...

【Python】软件测试必备:了解 fixture 在自动化测试中的重要作用

在自动化软件测试中,fixture 是一种确保测试在一致且受控条件下运行的重要方法。简单来说,fixture 就是一组先决条件或固定状态,必须在运行一组测试之前建立。在测试框架中,fixture 提供了一种方便的方法,用于在每个测…...

UE5 学习系列(二)用户操作界面及介绍

这篇博客是 UE5 学习系列博客的第二篇,在第一篇的基础上展开这篇内容。博客参考的 B 站视频资料和第一篇的链接如下: 【Note】:如果你已经完成安装等操作,可以只执行第一篇博客中 2. 新建一个空白游戏项目 章节操作,重…...

linux之kylin系统nginx的安装

一、nginx的作用 1.可做高性能的web服务器 直接处理静态资源(HTML/CSS/图片等),响应速度远超传统服务器类似apache支持高并发连接 2.反向代理服务器 隐藏后端服务器IP地址,提高安全性 3.负载均衡服务器 支持多种策略分发流量…...

可靠性+灵活性:电力载波技术在楼宇自控中的核心价值

可靠性灵活性:电力载波技术在楼宇自控中的核心价值 在智能楼宇的自动化控制中,电力载波技术(PLC)凭借其独特的优势,正成为构建高效、稳定、灵活系统的核心解决方案。它利用现有电力线路传输数据,无需额外布…...

Reasoning over Uncertain Text by Generative Large Language Models

https://ojs.aaai.org/index.php/AAAI/article/view/34674/36829https://ojs.aaai.org/index.php/AAAI/article/view/34674/36829 1. 概述 文本中的不确定性在许多语境中传达,从日常对话到特定领域的文档(例如医学文档)(Heritage 2013;Landmark、Gulbrandsen 和 Svenevei…...

AI病理诊断七剑下天山,医疗未来触手可及

一、病理诊断困局:刀尖上的医学艺术 1.1 金标准背后的隐痛 病理诊断被誉为"诊断的诊断",医生需通过显微镜观察组织切片,在细胞迷宫中捕捉癌变信号。某省病理质控报告显示,基层医院误诊率达12%-15%,专家会诊…...

三分算法与DeepSeek辅助证明是单峰函数

前置 单峰函数有唯一的最大值,最大值左侧的数值严格单调递增,最大值右侧的数值严格单调递减。 单谷函数有唯一的最小值,最小值左侧的数值严格单调递减,最小值右侧的数值严格单调递增。 三分的本质 三分和二分一样都是通过不断缩…...

Python 实现 Web 静态服务器(HTTP 协议)

目录 一、在本地启动 HTTP 服务器1. Windows 下安装 node.js1)下载安装包2)配置环境变量3)安装镜像4)node.js 的常用命令 2. 安装 http-server 服务3. 使用 http-server 开启服务1)使用 http-server2)详解 …...

Kafka主题运维全指南:从基础配置到故障处理

#作者:张桐瑞 文章目录 主题日常管理1. 修改主题分区。2. 修改主题级别参数。3. 变更副本数。4. 修改主题限速。5.主题分区迁移。6. 常见主题错误处理常见错误1:主题删除失败。常见错误2:__consumer_offsets占用太多的磁盘。 主题日常管理 …...

【Elasticsearch】Elasticsearch 在大数据生态圈的地位 实践经验

Elasticsearch 在大数据生态圈的地位 & 实践经验 1.Elasticsearch 的优势1.1 Elasticsearch 解决的核心问题1.1.1 传统方案的短板1.1.2 Elasticsearch 的解决方案 1.2 与大数据组件的对比优势1.3 关键优势技术支撑1.4 Elasticsearch 的竞品1.4.1 全文搜索领域1.4.2 日志分析…...

数学建模-滑翔伞伞翼面积的设计,运动状态计算和优化 !

我们考虑滑翔伞的伞翼面积设计问题以及运动状态描述。滑翔伞的性能主要取决于伞翼面积、气动特性以及飞行员的重量。我们的目标是建立数学模型来描述滑翔伞的运动状态,并优化伞翼面积的设计。 一、问题分析 滑翔伞在飞行过程中受到重力、升力和阻力的作用。升力和阻力与伞翼面…...