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

news2024/12/24 21:41:46

学习使用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日)

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

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

相关文章

一次enq: TM - contention分析

客户反映前台业务卡住了&#xff0c;怀疑是有锁表&#xff0c;锁表时查询等待事件是enq: TM - contention&#xff0c;因为是业务高峰期&#xff0c;所以直接把锁杀掉了&#xff0c;事后想要查一下锁表原因。 客户数据库环境是11g rac&#xff0c;我采集了锁表时间段两节点的a…

C++拷贝构造函数、赋值运算符重载

1.拷贝构造函数 拷贝构造函数的写法如图所示 调用方式如下 接下来我来说说它的特征 1.1特征 拷贝构造函数&#xff1a;只有单个形参&#xff0c;该形参是对本类类型对象的引用(一般常用const修饰)&#xff0c;在用已存在的类类型对象创建新对象时由编译器自动调用。 拷贝构造函…

算法学习——华为机考题库9(HJ56 - HJ63)

算法学习——华为机考题库9&#xff08;HJ56 - HJ63&#xff09; HJ56 完全数计算 描述 完全数&#xff08;Perfect number&#xff09;&#xff0c;又称完美数或完备数&#xff0c;是一些特殊的自然数。 它所有的真因子&#xff08;即除了自身以外的约数&#xff09;的和&…

Android配置GitLab CI/CD持续集成,Shell版本的gitlab-runner,FastLane执行,上传蒲公英

mac环境下&#xff0c; 首选需要安装gitlab-runner和fastlane brew install gitlab-runner brew install fastlane 安装完成&#xff0c;来到我们在gitlab下新建的Android项目&#xff0c;我们开始创建gitlab-runner 1、创建runner 点开runner&#xff0c;点击新建runner …

map容器的基本概念及常用成员函数

map&#xff08;字典&#xff09;的基本概念 map是一个将一个值映射到另一个值的一种数据结构。&#xff08;即两个值之间有一一对应关系&#xff09;。 map的所有元素都是pair类型&#xff0c;pair中的第一个元素称为键值&#xff08;key&#xff09;第二个元素称为实值&…

Vue工程引入Element-ui

npm 安装ELement-ui npm i element-ui -S 于package.json中发现有“element-ui”版本号即可 引入 Element 在 main.js 中写入以下内容&#xff1a; import element-ui/lib/theme-chalk/index.css; import ElementUI from element-ui;Vue.use(ElementUI);之后根据自己的需求设计…

【Apache POI库读取Excel文件,并使用HashMap来存储和检查重复项】

目录 下面是一个示例代码,使用Apache POI库读取Excel文件,并使用HashMap来存储和检查重复项。 import org.apache.poi.ss.usermodel.*; import org.apache.poi.xssf.usermodel.XSSFWorkbook;import java.io.FileInputStream; import java.io.IOException; import java.util.…

Web html

目录 1 前言2 HTML2.1 元素(Element)2.1.1 块级元素和内联(行级)元素2.1.2 空元素 2.2 html页面的文档结构2.3 常见标签使用2.3.1 注释2.3.2 标题2.3.3 段落2.3.4 列表2.3.5 超链接2.3.6 图片2.3.7 内联(行级)标签2.3.8 换行 2.4 属性2.4.1 布尔属性 2.5 实体引用2.6 空格2.7 D…

python_ACM模式《剑指offer刷题》二叉树1

题目&#xff1a; 面试tips&#xff1a; 1. 询问是否可以使用双端队列 (看后面思路就可知为什么要问这个) 思路&#xff1a; 时复和空复都为O(n) 思路一&#xff1a;利用双端队列。总体思想是利用二叉树层序遍历(二叉树的层序遍历就是用队列dq&#xff0c;且从左往右每一层…

java高级开发 章节练习题(选择、填空、判断)

第九章 常用实用类 一. 单选题 1. (单选题)String类的equals方法&#xff0c;其作用是&#xff1a; A. 比较2个字符串对象是否为同一个对象B. 比较2个字符串对象的字符长度是否相同C. 比较2个字符串对象的首地址是否相同D. 比较2个字符串对象的字符序列是否相同 答案: D:比…

HBase 数据导入导出

HBase 数据导入导出 1. 使用 Docker 部署 HBase2. HBase 命令查找3. 命令行操作 HBase3.1 HBase shell 命令3.2 查看命名空间3.3 查看命名空间下的表3.4 新建命名空间3.5 查看具体表结构3.6 创建表 4. HBase 数据导出、导入4.1 导出 HBase 中的某个表数据4.2 导入 HBase 中的某…

2V2无人机红蓝对抗仿真

两架红方和蓝方无人机分别从不同位置起飞&#xff0c;蓝方无人机跟踪及击毁红方无人机 2020a可正常运行 2V2无人机红蓝对抗仿真资源-CSDN文库

css1字体属性

一.font-family(字体系列&#xff09; 不同字体系统用&#xff0c;隔开&#xff1b; 多个字母的字体系统用“”&#xff1b; 二.font-size&#xff08;字体大小&#xff09;&#xff08;有单位px&#xff09;&#xff08;默认字体16px&#xff09; 三.font-weight&#xff08…

大数据信用报告在线查询平台哪个好?

随着大数据技术在金融风控的运用&#xff0c;大数据信用越来越被人熟知&#xff0c;由于线下没有查询大数据信用的地方&#xff0c;想要查询大数据信用报告只有在线上查询&#xff0c;那大数据信用报告在线查询平台哪个好呢?本文贷你一起去了解市面上比较好的三个平台。 大数据…

Unity 渲染管线自动转换的实现 支持HDRP转URP,URP转HDRP

HDRP和URP无法平滑切换&#xff0c;因为属性、功能差异巨大。 本脚本仅对可对应的默认脚本和属性做了转换处理。细节调整还需自己搞。 自动转换可以节省手动更换shader、texture、通用属性的劳动成本。 操作步骤 使用前确保当前项目中存在HDRP和URP的包&#xff0c;没有请到p…

Vue.js 学习14 集成H265web.js播放器实现webpack自动化构建

Vue.js 学习14 集成H265web.js播放器实现webpack自动化构建 一、项目说明1. H265web.js 简介2. 准备环境 二、项目配置1. 下载 H265web.js2. 在vue项目里引入 H265web3. 设置 vue.config.js 三、代码引用1. 参照官方demo &#xff0c; 创建 executor.js2. 在 vue 页面里引用htm…

批量检测微信小程序是否封禁接口源码

<?php // 要检测的 appid 列表 $appids array(appid1, appid2, appid3); // 使用实际的 appid // 循环调用接口检测小程序状态 foreach ($appids as $appid) { $url https://yan.changxunwangluo.cn/xcx/check_mini_program.php?appid . urlencode($appid); $…

【已解决】c++ qt选中该行为什么该列部分变色

笔者开启了QTableView中交替行改变颜色&#xff0c;发现笔者自定义绘制的水平滚动条&#xff0c;在选中后不发生颜色改变&#xff0c;这让笔者很疑惑。笔者查阅资料后发现&#xff0c;自定义绘制的控件&#xff0c;要自身设置颜色。当笔者解决了这个问题时&#xff0c;顺手就将…

GPT原始论文:Improving Language Understanding by Generative Pre-Training论文翻译

1 摘要 自然语理解包括文本蕴含、问题回答、语义相似性评估和文档分类等一系列多样化的任务。尽管大量未标注的文本语料库很丰富&#xff0c;但用于学习这些特定任务的标注数据却很稀缺&#xff0c;这使得基于区分性训练的模型难以充分发挥作用。我们展示了通过在多样化的未标…

高级Java开发工程师岗位的基本职责(合集)

高级Java开发工程师岗位的基本职责1 职责&#xff1a; 1、负责区块链产品的研发&#xff0c;独立或与团队合作&#xff0c;按时保质完成软件开发项目; 2、参与产品系统设计、概要设计工作&#xff0c;核心功能的代码编写; 3、独立解决和指导其他同事处理开发中遇到的难点问题; …