vite, vue3, vue-router, vuex, ES6学习日记

news2024/11/14 23:25:43

学习使用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 是对应的。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1429799.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Leetcode—2881. 创建新列【简单】

2024每日刷题&#xff08;一零九&#xff09; Leetcode—2881. 创建新列 实现代码 import pandas as pddef createBonusColumn(employees: pd.DataFrame) -> pd.DataFrame:employees[bonus] employees[salary] * 2return employees 运行结果 之后我会持续更新&#xf…

Deepin如何开启与配置SSH实现无公网ip远程连接

文章目录 前言1. 开启SSH服务2. Deppin安装Cpolar3. 配置ssh公网地址4. 公网远程SSH连接5. 固定连接SSH公网地址6. SSH固定地址连接测试 前言 Deepin操作系统是一个基于Debian的Linux操作系统&#xff0c;专注于使用者对日常办公、学习、生活和娱乐的操作体验的极致&#xff0…

leetcode刷题(剑指offer)113.路径总和Ⅱ

113.路径总和Ⅱ 给你二叉树的根节点 root 和一个整数目标和 targetSum &#xff0c;找出所有 从根节点到叶子节点 路径总和等于给定目标和的路径。 叶子节点 是指没有子节点的节点。 示例 1&#xff1a; 输入&#xff1a;root [5,4,8,11,null,13,4,7,2,null,null,5,1], tar…

解锁教育系统源码的定制奥秘:企业培训平台开发详解

今天&#xff0c;小编将为大家讲解教育系统源码的奥秘&#xff0c;详细解释企业培训定制开发的关键步骤和技术要点。 一、需求分析与设计阶段 设计阶段则包括系统的整体架构设计、数据库设计以及用户界面设计等方面。 二、技术选型与开发环境搭建 通过使用版本控制系统、集成…

解决WARNING: IPv4 forwarding is disabled. Networking will not work的具体操作步骤

IPv4转发禁用警告&#xff1a;网络无法正常工作 在使用网络连接的过程中&#xff0c;我们可能遇到警告消息“WARNING: IPv4 forwarding is disabled. Networking will not work”&#xff08;警告&#xff1a;IPv4转发已禁用&#xff0c;网络将无法正常工作&#xff09;。这个…

2024美赛E题数学建模思路代码数据分享

2024 ICM Problem E: Sustainability of Property Insurance 本题要求选取不同大陆上经历极端天气的两个地区来为保险公司开发模型&#xff0c;本题的重点是找到尽可能多而全的数据&#xff0c;包括天气数据&#xff0c;经济数据&#xff0c;人口数据等。 模型选择&#xff1a…

【Python】【完整代码】解析Excel文件内容,按每列首行元素名打印出某个字符串的统计占比(超详细)

目录 1.示例&#xff1a; 1.1 实现代码1&#xff1a;列数为常量 运行结果&#xff1a; 1.2 实现代码2&#xff1a;列数为变量 运行结果&#xff1a; 1.示例&#xff1a; 开发需求&#xff1a;读取Excel文件&#xff0c;统计第3列到第5列中每列的"False"字段占…

C语言——P/文件操作

一、为什么使用文件&#xff1f; 如果没有⽂件&#xff0c;我们写的程序的数据是存储在电脑的内存中&#xff0c;如果程序退出&#xff0c;内存回收&#xff0c;数据就丢失了&#xff0c;等再次运⾏程序&#xff0c;是看不到上次程序的数据的&#xff0c;如果要将数据进⾏持久…

数据结构—基础知识:哈夫曼树

文章目录 数据结构—基础知识&#xff1a;哈夫曼树哈夫曼树的基本概念哈夫曼树的构造算法哈夫曼树的构造过程哈夫曼算法的实现算法&#xff1a;构造哈夫曼树 数据结构—基础知识&#xff1a;哈夫曼树 哈夫曼树的基本概念 哈夫曼&#xff08;Huffman&#xff09;树又称最优树&…

gtest测试框架

文章目录 前言1 单元测试2 gtest安装3 gtest原理4 断言4.1 明确指定或失败4.2 布尔条件4.3 二元比较4.4 谓词断言4.5 死亡测试5 gtest使用5.1 测试函数5.2 测试类5.3 测试夹具5.4 类型参数化5.5 事件总结前言 GoogleTest(GTest) 是谷歌开源的 C++ 单元测试框架。 1 单元测试…

redis存储对象的过期设置在实际项目中的运用案例展示

redis存储对象的过期设置在实际项目中的运用案例展示&#xff01;经过前面的学习&#xff0c;我们已经基本上初步掌握了redis数据库存储对象的过期时间是如何设置的了。下面给大家展示一个具体的实际开发项目中用到业务场景。 在项目化生寺小程序游戏开发中&#xff0c;有道具&…

什么是TCP粘包和半包问题?如何解决?

什么是TCP粘包问题&#xff1f;如何解决&#xff1f; TCP粘包和半包是数据传输中比较常见的问题。所谓的粘包问题就是指在数据传输的时候&#xff0c;在一条消息中读取到了另一条消息的部分数据&#xff0c;如下图&#xff1a; 半包是指接收端只收到了部分的数据&#xff0c;而…

【C语言/基础梳理/期末复习】动态内存管理(附思维导图)

目录 一、为什么要有动态内存分配 &#xff08;1&#xff09;我们已经掌握的内存方式的特点 &#xff08;2&#xff09;需求 二、malloc和free 2.1.malloc 2.1.1函数原型 2.1.2函数使用 2.1.3应用示例​编辑 2.2free 2.2.1函数原型 2.2.2函数使用 三、calloc和reallo…

算法练习-左叶子之和(思路+流程图+代码)

难度参考 难度&#xff1a;中等 分类&#xff1a;二叉树 难度与分类由我所参与的培训课程提供&#xff0c;但需要注意的是&#xff0c;难度与分类仅供参考。且所在课程未提供测试平台&#xff0c;故实现代码主要为自行测试的那种&#xff0c;以下内容均为个人笔记&#xff0c;旨…

rust gui开发框架选择

作为一个系统编程强大语言&#xff0c;怎么能少得了图形界面的开发 实际上写这篇前我也不知道&#xff0c;于是我问了ai大模型&#xff0c;文心3.5和chatgpt4.0 答案实际上不能满意&#xff0c;最后我做了下筛选 参考博文&#xff1a; rust开发环境配置&#xff1a;链接 一、…

Loadbalancer如何优雅分担服务负荷

欢迎来到我的博客&#xff0c;代码的世界里&#xff0c;每一行都是一个故事 Loadbalancer如何优雅分担服务负荷 前言Loadbalancer基础&#xff1a;数字世界的分配大师1. 分发请求&#xff1a;2. 健康检查&#xff1a;3. 会话保持&#xff1a;4. 可伸缩性&#xff1a;5. 负载均衡…

数据结构—基础知识:哈夫曼编码

文章目录 数据结构—基础知识&#xff1a;哈夫曼编码哈夫曼编码的主要思想有关编码的概念哈夫曼编码满足两个性质&#xff1a; 数据结构—基础知识&#xff1a;哈夫曼编码 哈夫曼编码的主要思想 在进行数据压缩时&#xff0c;为了使压缩后的数据文件尽可能短&#xff0c;可采…

二手电脑配置给你不一样的成就感

回顾从小到大使用电脑、组装电脑到开发软硬件的经历&#xff0c;总是对二手电脑有着不一样的情感&#xff0c;近五年买过八台新电脑&#xff0c;一台是图像处理培训买的笔记本&#xff0c;一台是小孩上课的台式机&#xff0c;一台是老人的集成办卡电脑&#xff0c;还有一些工作…

Vue3_基础使用_2

这节主要介绍&#xff1a;标签和组件的ref属性&#xff0c;父子组件间的传递值&#xff0c;ts的接口定义&#xff0c;vue3的生命周期 1.标签的ref属性。 1.1ref属性就是给标签打标识用的&#xff0c;相当于html的id&#xff0c;但是在vue3中用id可能会乱&#xff0c;下面是ref…

跟着cherno手搓游戏引擎【18】抽象Shader、项目小修改

抽象&#xff1a; Shader.h: #pragma once #include <string>namespace YOTO {class Shader {public:virtual~Shader()default;virtual void Bind()const0;virtual void UnBind()const0;static Shader* Create(const std::string& vertexSrc, const std::string&am…