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

【退役之重学前端】vite, vue3, vue-router, vuex, ES6学习日记

学习使用vite+vue3的所遇问题总结(2024年2月1日)

  1. 组件中使用<script>标签忘记加 setup
    在这里插入图片描述

这会导致Navbar 没有暴露出来,导致使用不了,出现以下报错
在这里插入图片描述
这是因为,如果不用setup,就得使用 export default ……
setup 是后者的语法糖

  1. 在Vue.js中,你可以通过route对象来接收从router-link传递过来的参数。具体来说,你可以使用route对象的params属性来获取路由参数。

  2. 通过 传递的参数,都需要设置到路由中,否则会丢失参数
    在这里插入图片描述
    在这里插入图片描述

vite/vue3/vue-router/vuex 已经整体上掌握,开始复习ES6(2024年2月2日)

学习资料来源: 菜鸟教程

let 和 const 命令。

  1. let 块级作用域
 for (let i = 0; i < 10; i++) {// ...
}
  1. const 声明一个只读变量,声明之后不允许改变。意味着,一旦声明必须初始化,否则会报错。

  2. 注意要点
    const 如何做到变量在声明初始化之后不允许改变的?其实 const 其实保证的不是变量的值不变,而是保证变量指向的内存地址所保存的数据不允许改动。此时,你可能已经想到,简单类型和复合类型保存值的方式是不同的。是的,对于简单类型(数值 number、字符串 string 、布尔值 boolean),值就保存在变量指向的那个内存地址,因此 const 声明的简单类型变量等同于常量。而复杂类型(对象 object,数组 array,函数 function),变量指向的内存地址其实是保存了一个指向实际数据的指针,所以 const 只能保证指针是固定的,至于指针指向的数据结构变不变就无法控制了,所以使用 const 声明复杂类型对象时要慎重。

  3. ES6 解构赋值
    解构赋值是对赋值运算符的扩展。
    他是一种针对数组或者对象进行模式匹配,然后对其中的变量进行赋值。

  4. ES6 引入了一种新的原始数据类型 Symbol ,表示独一无二的值,最大的用法是用来定义对象的唯一属性名。
    注意点
    Symbol 值作为属性名时,该属性是公有属性不是私有属性,可以在类的外部访问。但是不会出现在 for…in 、 for…of 的循环中,也不会被 Object.keys() 、 Object.getOwnPropertyNames() 返回。如果要读取到一个对象的 Symbol 属性,可以通过 Object.getOwnPropertySymbols() 和 Reflect.ownKeys() 取到。

  5. ES6 Map 与 Set
    Set 对象允许你存储任何类型的唯一值,无论是原始值或者是对象引用。

  6. Proxy 与 Reflect 是 ES6 为了操作对象引入的 API 。
    Proxy 不直接操作对象,而是像代理模式,通过对象的代理对象进行操作;
    通过构造函数新建实例时其实是对目标对象进行了浅拷贝,因此目标对象与代理对象会互相影响;
    get() 方法可以继承,let obj = Object.create(proxy);
    Reflect 可以用于获取目标对象的行为,它的方法与 Proxy 是对应的。

  7. 箭头函数
    箭头函数体中的 this 对象,是定义函数时的对象,而不是使用函数时的对象。

  8. 在JavaScript中,如果一个函数没有明确的return语句或者没有返回值,它会默认返回"undefined"。而且就算是return了而没有执行,它此时的类型也是undefined。

  9. class 的本质是 function。
    它可以看作一个语法糖,让对象原型的写法更加清晰、更像面向对象编程的语法。
    类中方法不需要 function 关键字。
    方法间不能加分号。

  10. ES6 模块
    ES6 的模块自动开启严格模式,不管你有没有在模块头部加上 use strict;。

  11. ES6 Promise 对象
    是异步编程的一种解决方案。

从语法上说,Promise 是一个对象,从它可以获取异步操作的消息。

vite, vue3, vue-router, vuex, ES6 学习完成 (2024年2月4日)

相关文章:

【退役之重学前端】vite, vue3, vue-router, vuex, ES6学习日记

学习使用vitevue3的所遇问题总结&#xff08;2024年2月1日&#xff09; 组件中使用<script>标签忘记加 setup 这会导致Navbar 没有暴露出来&#xff0c;导致使用不了&#xff0c;出现以下报错 这是因为&#xff0c;如果不用setup&#xff0c;就得使用 export default…...

[linux]-总线,设备,驱动,dts

1. 总线BUS 在物理层面上&#xff0c;代表不同的工作时序和电平特性&#xff1a; 总线代表着同类设备需要共同遵守的工作时序&#xff0c;不同的总线对于物理电平的要求是不一样的&#xff0c;对于每个比特的电平维持宽度也是不一样&#xff0c;而总线上传递的命令也会有自己…...

python3实现gitlab备份文件上传腾讯云COS

gitlab备份文件上传腾讯云COS 脚本说明脚本名称&#xff1a;upload.py 假设gitlab备份文件目录&#xff1a;/opt/gitlab/backups gitlab备份文件格式&#xff1a;1706922037_2024_02_06_14.2.1_gitlab_backup.tar1.脚本需和gitlab备份文件同级目录 2.根据备份文件中的日期判断…...

292.Nim游戏

桌子上有一堆石头。 轮流进行自己的回合&#xff0c; 你作为先手 。 每一回合&#xff0c;轮到的人拿掉 1 - 3 块石头。 拿掉最后一块石头的人就是获胜者。 假设你们每一步都是最优解。请编写一个函数&#xff0c;来判断你是否可以在给定石头数量为 n 的情况下赢得游戏。如果可…...

Spring和Spring Boot的区别

Spring 是一个轻量级的 Java 开发框架&#xff0c;它提供了一系列的模块和功能&#xff0c;例如 IoC&#xff08;控制反转&#xff09;、AOP&#xff08;面向方面编程&#xff09;、数据库访问、Web 开发等。Spring 的目标是使 Java 开发更加简单、高效和可维护。 Spring Boot …...

备战蓝桥杯---动态规划(理论基础)

目录 动态规划的概念&#xff1a; 解决多阶段决策过程最优化的一种方法 阶段&#xff1a; 状态&#xff1a; 决策&#xff1a; 策略&#xff1a; 状态转移方程&#xff1a; 适用的基本条件 1.具有相同的子问题 2.满足最优子结构 3.满足无后效性 动态规划的实现方式…...

FPGA_ip_pll

常使用插件管理器进行ip核的配置&#xff0c;ip核分为计算&#xff0c;存储&#xff0c;输入输出&#xff0c;视频图像处理&#xff0c;接口&#xff0c;调试等。 一 pll ip核简介 pll 即锁相环&#xff0c;可以对输入到fpga的时钟信号&#xff0c;进行分频&#xff0c;倍频&…...

【实验3】统计某电商网站买家收藏商品数量

文章目录 一、实验目的和要求∶二、实验任务∶三、实验准备方案,包括以下内容:实验内容一、实验环境二、实验内容与步骤(过程及数据记录):三、实验结果分析、思考题解答∶四、感想、体会、建议∶一、实验目的和要求∶ 现有某电商网站用户对商品的收藏数据,记录了用户收藏…...

【Qt】Android上运行keeps stopping, Desktop上正常

文章目录 问题 & 背景背景问题 解决方案One More ThingTake Away 问题 & 背景 背景 在文章【Qt】最详细教程&#xff0c;如何从零配置Qt Android安卓环境中&#xff0c;我们在Qt中配置了安卓开发环境&#xff0c;并且能够正常运行。 但笔者在成功配置并完成上述文章…...

算法学习打卡day47|单调栈系列题目

单调栈题目思路 通常是一维数组&#xff0c;要寻找任一个元素的右边或者左边第一个比自己大或者小的元素的位置&#xff0c;此时我们就要想到可以用单调栈了。时间复杂度为O(n)。单调栈的本质是空间换时间&#xff0c;因为在遍历的过程中需要用一个栈来记录右边第一个比当前元…...

Maven构建OSGI+HttpServer应用

Maven构建OSGIHttpServer应用 官网&#xff08;https://eclipse.dev/equinox/server/http_in_equinox.php&#xff09;介绍有两种方式&#xff1a; 一种是基于”org.eclipse.equinox.http”包的轻量级实现&#xff0c;另一种是基于”org.eclipse.equinox.http.jetty”包&#…...

chrome扩展插件常用文件及作用

Chrome扩展通常包含以下常用文件及其作用&#xff1a; manifest.json&#xff1a; 描述了扩展的基本信息&#xff0c;如名称、版本、权限、图标等。定义了扩展的各种组件和功能&#xff0c;包括后台脚本、内容脚本、页面、浏览器动作按钮等。 background.js&#xff1a; 后台脚…...

PdfFactory Pro软件下载以及序列号注册码生成器

PdfFactory Pro注册机是一款针对同名虚拟打印机软件所推出的用户名和序列号生成器。PdfFactory Pro是一款非常专业的PDF虚拟打印软件&#xff0c;通过使用这款注册机&#xff0c;就能帮助用户免费获取注册码&#xff0c;一键激活&#xff0c;永久免费使用。 pdffactory7注册码如…...

jsp康养小镇管理系统Myeclipse开发mysql数据库web结构java编程计算机网页项目

一、源码特点 JSP康养小镇管理系统是一套完善的java web信息管理系统&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模式开发。开发环境为TOMCAT7.0,Myeclipse8.5开发&#xff0c;数据库为Mysql5.0&a…...

Android 无操作之后定时退出

android定时器监用户听对页面无操作5分钟退出登录实现 - 简书 private long advertisingTime 600000;///定时结束退出登录10分(分钟)600000毫秒public CountDownTimer countDownTimer;Overrideprotected void onResume() {super.onResume();//启动定时if (isTimedExitApp()) …...

CMS 检测神器:CMSeek 保姆级教程(附链接)

一、介绍 CMSeek&#xff08;Content Management System Exploitation and Enumeration Toolkit&#xff09;是一款用于检测和利用网站上可能存在的内容管理系统&#xff08;CMS&#xff09;漏洞的开源工具。它旨在帮助安全研究人员和渗透测试人员识别目标网站所使用的CMS&…...

oracle 启动命令以及ORA-01033问题处理、删除归档日志

1 启动数据库:startup 2 关闭数据库&#xff1a;Shutdown immediate 3 查看监听状态&#xff1a;lsnrctl status 4 启动监听&#xff1a;lsnrctl start 5 停止监听&#xff1a;lsnrctl stop 常见问题 1、在服务器重启后会出现&#xff0c;Oracle ORA-01033: ORAC…...

【大模型上下文长度扩展】MedGPT:解决遗忘 + 永久记忆 + 无限上下文

MedGPT&#xff1a;解决遗忘 永久记忆 无限上下文 问题&#xff1a;如何提升语言模型在长对话中的记忆和处理能力&#xff1f;子问题1&#xff1a;有限上下文窗口的限制子问题2&#xff1a;复杂文档处理的挑战子问题3&#xff1a;长期记忆的维护子问题4&#xff1a;即时信息检…...

谷歌seo搜索引擎优化有什么思路?

正常做seo哪有那么多思路&#xff0c;其实就那么几种方法&#xff0c;无非就关键词&#xff0c;站内优化&#xff0c;外链&#xff0c;可以说万变不离其宗&#xff0c;但如果交给我们&#xff0c;你就可以实现其他的思路&#xff0c;或者说玩法 收录可以说是一个网站的基础&…...

腾讯云与IBM共同打造“高性能计算服务解决方案“

腾讯云与IBM共同打造"高性能计算服务解决方案" 腾讯云与IBM达成战略合作&#xff0c;对优势产品及服务进行深度集成&#xff0c;基于腾讯云产品及服务&#xff0c;共同打造"腾讯-IBM混合云与人工智能解决方案"。双方通过更为紧密的嵌入式解决方案的深度合…...

驾驭AI引用:Geo优化中的内容评分机制与实战策略深度解析

在生成式人工智能&#xff08;Generative AI&#xff09;日益主导信息获取与分发路径的时代&#xff0c;传统搜索引擎优化&#xff08;SEO&#xff09;的范式正被生成式引擎优化&#xff08;Geo&#xff09;所颠覆。Geo不再仅仅关注关键词排名&#xff0c;而是深入探究内容如何…...

XCZU67DR的PS和PL怎么协同干活?一个案例讲透ARM核与FPGA联动处理高速ADC数据流

XCZU67DR异构计算实战&#xff1a;ARM核与FPGA协同处理5.9G ADC数据流的架构设计 在当今信号处理领域&#xff0c;实时处理高速ADC数据流已成为雷达、通信和医疗成像等应用的核心需求。当采样率攀升至5.9G级别时&#xff0c;传统CPU或FPGA单独处理的架构往往捉襟见肘。这正是Xi…...

如何用掩码生成蒸馏(MGD)提升小模型性能?实战ResNet-18到ImageNet分类

掩码生成蒸馏实战&#xff1a;如何让ResNet-18在ImageNet上提升1.8%准确率 在模型轻量化的浪潮中&#xff0c;知识蒸馏技术正经历着从简单模仿到特征重构的范式转变。当我们用ResNet-50这样的"大模型"指导ResNet-18等"小模型"训练时&#xff0c;传统方法往…...

UReport2实战:如何优雅地导出多Sheet页报表(动态/静态分页全解析)

UReport2实战&#xff1a;如何优雅地导出多Sheet页报表&#xff08;动态/静态分页全解析&#xff09; 在数据驱动的商业环境中&#xff0c;报表导出功能已成为企业级应用的标配需求。当面对海量数据时&#xff0c;传统的单Sheet页Excel导出方案往往导致文件臃肿、查阅困难。URe…...

springboot框架健康饮食营养管理信息系统

目录需求分析与系统设计技术栈选型与环境搭建核心功能实现数据可视化与报告生成测试与部署项目技术支持源码获取详细视频演示 &#xff1a;文章底部获取博主联系方式&#xff01;同行可合作需求分析与系统设计 明确健康饮食营养管理系统的核心需求&#xff0c;包括用户注册登录…...

深度解析PDFMathTranslate:揭秘AI如何实现毫秒级学术文档翻译与精准排版保留

深度解析PDFMathTranslate&#xff1a;揭秘AI如何实现毫秒级学术文档翻译与精准排版保留 【免费下载链接】PDFMathTranslate PDF scientific paper translation with preserved formats - 基于 AI 完整保留排版的 PDF 文档全文双语翻译&#xff0c;支持 Google/DeepL/Ollama/Op…...

【生产环境实录】Mojo嵌入Python解释器时core dump突增300%:我们如何通过LLVM IR层Hook定位并修复内存所有权越界

第一章&#xff1a;【生产环境实录】Mojo嵌入Python解释器时core dump突增300%&#xff1a;我们如何通过LLVM IR层Hook定位并修复内存所有权越界问题现象与紧急响应 上线后72小时内&#xff0c;Mojo服务在调用 PyRun_String 执行动态Python代码片段时&#xff0c;core dump率从…...

机器人手臂相机 vs 抓手相机:5个关键区别与选型指南(附避坑技巧)

机器人手臂相机 vs 抓手相机&#xff1a;5个关键区别与选型指南&#xff08;附避坑技巧&#xff09; 在工业自动化领域&#xff0c;视觉引导系统如同机器人的"眼睛"&#xff0c;而相机安装位置的选择往往决定了整个系统的精度与可靠性。当工程师面对手臂相机&#xf…...

SVGnest智能排版优化器:5分钟掌握材料利用率翻倍的终极技巧

SVGnest智能排版优化器&#xff1a;5分钟掌握材料利用率翻倍的终极技巧 【免费下载链接】SVGnest An open source vector nesting tool 项目地址: https://gitcode.com/gh_mirrors/sv/SVGnest 想象一下&#xff0c;您是否经常在激光切割、CNC加工或3D打印中面临材料浪费…...

最大数(信息学奥赛一本通- P1549)(洛谷-P1198)

【题目描述】原题来自&#xff1a;JSOI 2008给定一个正整数数列 a1,a2,a3,⋯,an &#xff0c;每一个数都在 0∼p–1 之间。可以对这列数进行两种操作&#xff1a;添加操作&#xff1a;向序列后添加一个数&#xff0c;序列长度变成 n1&#xff1b;询问操作&#xff1a;询问这个序…...