- 博客(33)
- 收藏
- 关注
原创 vue3中使用pinia
详情:https://www.jb51.net/javascript/320242udc.htm。在src目录下创建store文件夹,在store文件夹下创建index.js文件。
2024-06-19 16:43:38
236
原创 vue3中的路由和路由传参
1.路由组件通常存放在pages或views文件夹,一般组件通常放在components文件夹。缺点:后期项目上线,需要服务器配合处理路径问题,否则刷新页面会有404错误。2)params传参要在组件中先进行占位,可传可不传的参数后面加问号?2.通过点击导航,视觉效果上‘消失’了的路由组件,默认是被。优点:url更加美观,不带#,更接近传统的网站url。1.作用:控制路由跳转时操作浏览器历史记录的模式。2.多个路由,需要经过路由器的管理。路由组件:靠路由的规则渲染出来的。push是追加历史记录(默认值)
2024-06-06 10:09:12
523
原创 vue3生命周期
befofeDestroy销毁前。beforeCreate创建前。beforeUpdate更新前。创建 setup直接去默认创建。beforeMount挂载前。创建 挂载 更新 销毁。destroyed销毁后。created创建完毕。mounted挂载完毕。updated更新完成。
2024-06-04 17:22:45
197
原创 标签的ref属性,可以用在普通html标签上,也可以用在组件上
拿到这个容器中的name.value为当前dom。在ts中,声明变量name = ref()直接写在基本元素上,ref=“name”在子组件中要暴露可访问的数据,才能拿到。
2024-06-03 10:38:44
588
原创 watch对比watchEffect
3.watchEffect:不用明确指出监视的数据(函数中用到哪些属性,就监视哪些属性)1.都能监听响应式数据的变化,不同的是监听数据变化的方式不同。2.watch:要明确指出监视的数据。
2024-06-03 10:04:24
202
原创 vue3中的computed和watch的使用
2)若修改整个ref定义的对象,newValue是新值,oldValue是旧值,因为不是同一个对象了。,newValue和oldValue都是新值,因为他们是同一个对象。2) 若该属性值依然是【对象类型】,可以直接编,也可以写成函数,作用:监听数据的变化(和vue2的watch作用一致)监听ref或reactive定义的【对象类型】数据中的。1)若该属性值不是【对象类型】,需要写成函数形式。2.reactive定义的数据。1)若修改的是ref定义的。4.一个包含上述内容的数组。1.ref定义的数据。
2024-05-31 16:52:01
364
原创 vue3组合式API setup ref和reactive
setup是vue3中的一个新的配置项vue2中写法可以读取到新写法中的东西,所以setup执行在data之前,可以在ref定义基本类型数据,对象类型的响应式数据reactive定义对象类型数据响应式数据。
2024-05-30 17:36:47
413
原创 vue3学习,新建vue3项目
vite项目中,index.html是项目的入口文件,在项目的最外层。加载index.html后,vite解析指向javascript。vue3中是通过createApp函数创建一个应用实例。npm create vue@latest创建项目命令。1.创建一个vue3工程。
2024-05-30 14:29:28
213
原创 解决使用第三方库部署报错问题
引入第三方组件库移动端VirTree,结果部署不上去,ts校验 导出的是type类型不是模块。最后尝试 部署的时候忽略检测// @ts-ignore。如大佬有更好解决方案,希望可以交流!加type拿不到组件。
2024-05-27 16:05:07
224
1
原创 前端面试总结
我司现在就是前端来控制页面级的权限,不同权限的用户显示不同的侧边栏和限制其所能进入的页面(也 做了少许按钮级别的权限控制),后端则会验证每一个涉及请求的操作,验证其是否有该操作的权限,每 一个后台的请求不管是 get 还是 post 都会让前端在请求 header 里面携带用户的 token,后端会根据 该 token 来验证用户是否有权限执行该操作。也就是说,Object 结构提供了“字符串—值”的对应,Map 结构提供了“值—值”的对应,是一种更完善的 Hash 结构实现。状态一旦改变,就不会再变。
2023-10-25 15:17:17
106
原创 前端面试总结三【8道题】
28.vue中computed和watch的区别是什么?computed用来监控自己定义的变量,该变量不在data里面声明,直接在computed里面定义,然后可以在网页中进行双向绑定展示出结果或其他作用watch主要用于监控vue实例的变化,它监控的变量必须在data中声明才可以,可以监控一个变量,一个对象一般用于监控路由,input输入框的值特殊处理等,不具有缓存性watch:监测的是属性值, 只要属性值发生变化,其都会触发执行回调函数来执行一系列操作。
2023-10-08 16:21:13
119
1
原创 前端面试总结二【共11道题】
递归: 如果一个函数在内部可以调用其本身,那么这个函数就是递归函数。简单理解:函 数内部自己调用自己, 这个函数就是递归函数优点: 结构清晰、可读性强缺点: 效率低、调用栈可能会溢出,其实每一次函数调用会在内存栈中分配空间,而每个进程的栈的容 量是有限的,当调用的层次太多时,就会超出栈的容量,从而导致栈溢出。->性能。
2023-10-08 00:01:02
112
1
原创 前端面试总结一【15道题】
MVC: MVC 即 model-view-controller(模型-视图-控制器)是项目的一种分层架构思想,它把复杂的业务逻辑,抽离为职能单一的小模块,每个模块看似相互独立,其实又各自有相互依赖关系。它的好处是:保证了模块的智能单一性,方便程序的开发、维护、耦合度低。
2023-10-07 09:33:18
125
1
原创 html原生表格复习
thead属性 :height=“50” align="center"水平对齐方式 valign="top"垂直对齐方式。表格常用属性:border属性 width height cellspacing=‘0’ 边框中间距离为0。colspan=“5” 跨列 rowspan="3"跨行。tbody,tfooot属性同thead。主体中的单元格用td。
2023-09-22 15:53:53
146
原创 2021-06-02ES6中promise介绍及应用then,catch方法
Promise介绍与基本使用promise<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><script>const p=new Promise(function(resolve,reject){ setTimeout(functio
2021-06-02 16:10:20
117
原创 2021-06-02ES6中Symbol类型 迭代器iterator异步编程使用场景
1.Symbol的基本使用symbol表示独一无二的值,类似于字符串的数据类型特点:1)symbol的值是唯一的,用来解决命名冲突的问题2)symbol值不能与其他数据进行运算3)symbol定义的对象不能用for…in… 进行遍历,但可以使用reflect.ownKeys来获取对象的所有键名数据类型:USONBU:undefiendS;string,symbolO:objectN:null,numberB:boolean应用场景:迭代器(iterator):是一种接口,为各种不
2021-06-02 14:34:03
306
原创 2021-05-31ES6中let const 模板字符串 箭头函数以及扩展运算符
ECMAsctipt:ES6let声明 1.变量不能重复声明 2.代码只在代码块中起作用 3.不存在变量提升案例描述:小方块改变颜色,用let遍历颜色切换<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> /**{ margin:
2021-06-02 09:59:18
117
原创 2021-05-17js中类的操作(addClass,removeClass,toggleClass)
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> .b1{ width: 100px; height: 100px; background-color: red; }
2021-05-18 00:17:23
168
原创 2021-05-14js案例 轮播图
效果描述:插入图片后,下面有导航按钮,点击按钮图片切换,图片还可以自动切换静态截图:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0; padding: 0; }
2021-05-14 17:26:53
66
原创 2021-05-13js中事件的传播及BOM元素
Js事件的传播:事件捕获:1) 捕获阶段:w3c认定捕获阶段是从最外层的祖先元素,向目标元素进行事件的捕获,但是默认不会触发事件2) 目标阶段:事件捕获到目标元素,捕获结束开始在目标元素上触发事件3) 冒泡阶段:事件从目标元素向祖先元素传递,依次触发祖先元素上的事件拖拽练习拖拽的流程:当鼠标在被拖拽元素上按下时,开始拖拽,元素跟随鼠标移动,当鼠标松开,固定到当前位置键盘事件键盘事件一般可以绑定给一些可以获取到焦点的对象或者是documentonkeyup是键盘抬起,onkeydown键盘
2021-05-13 14:37:50
78
原创 2021-05-05js中事件的冒泡,委托,绑定
5.5.20211.事件的冒泡(Bubble):所谓的冒泡就是事件的向上传导,当后代元素上的事件被触发时,其祖先元素的相同事件也会被触发 【在开发中大部分冒泡是有用的】阻止冒泡:event=event||window.event;event.cancelBubble=true;2.事件的委托:将事件统一绑定给元素的共同的祖先元素,这样当后代元素上的事件触发时,会一直冒泡到祖先元素,从而通过祖先元素的响应函数来处理事件。事件委托利用冒泡,通过委托减少事件绑定的次数,提高程序的性能<!DOC
2021-05-07 11:54:33
113
原创 2021-04-20js的全选练习(全选,全不选,反选,提交)
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script> window.onload = function(){ //全选,点击按钮后全被选中 var checkAllBtn=document.getElementByI.
2021-04-20 17:11:43
131
原创 2021-04-14js中的DOM查询+图片切换案例
4.14.2021DOM简介:文档节点:整个HTML文档元素节点:html文档中的html标签属性节点:元素的属性文本节点:html标签中的文本内容1. 事件:就是浏览器和用户之间的交互行为,比如点击按钮,鼠标移动,关闭窗口……2. dom查询获取元素节点:1)getElementById()通过id属性获取一个元素节点对象2)getElementsByTagName()通过标签名获取一组元素节点对象3)getElementsByName()通过name属性获取一组元素节点对象
2021-04-14 16:15:23
275
原创 2021-04-13js基础语法总结+字符串方法,正则表达式
字符串的方法1.charAt(5)可以返回字符串中指定位置的字符2.indexof()检索字符串中是否含有指定内容,并返回第一次出现的索引,如果没有找到指定的内容则返回-1;lastIndexof是从后往前找3.slice()截取指定内容,不会影响原字符串,而是将截取内容返回参数:第一个开始位置索引(包括开始位置)第二个结束位置索引(不包括结束位置)也可以传递一个负数作为参数,负数则会从后面进行计算subString()截取方法类似,不同的是不能传负数,如果传默认是0subStr()用来截
2021-04-13 16:55:44
98
原创 2021-04-02js中数组array方法介绍
1.数组的方法slice()从已有的数组返回现有的元素,可以用来从数组提取指定元素参数:1.截取开始的位置的索引2.截取结束的位置的索引,第二个参数可以不写,截取开始后所有元素索引可以传一个负值,从后往前计算该方法不会改变原数组,而是将截取的元素封装到一个新数组返回splice()可以用于删除数组中的指定元素,会影响原数组,会将指定元素从原数组中删除,并将被删除的元素作为返回值返回参数:1.表示开始位索引 2.表示删除的数量 3.第三个及以后可以传入新的元素插入练习删除重复的数2.函
2021-04-12 08:39:43
233
原创 2021-03-28js的基础语法总结数组简介
3.28.20211.Debug:打断点,看source执行This:指向的是一个对象,我们称为函数执行的上下文对象(指谁打谁)1)以函数的形式调用fun(),this永远指向window2)以方法的形式调用obj.name( ),this就是调用方法的那个对象3)以构造函数调用时,this是新创建的对象2.使用工厂方法创建对象3.构造函数构造函数就一个普通函数,创建方法和普通函数没有区别,不同的是构造函数习惯性首字母大写区别:调用方式不同 普通函数是直接调用,而构造函数需要使用new
2021-04-02 10:03:01
204
2
原创 2021-03-25js的基础语法总结对象和函数
3.25.20211.break可以用来退出switch或循环语句,不能在if语句中使用break和continuebreak会立即终止离它最近的循环continue用来跳过当次循环,只会对离得最近的循环起作用//测试程序的性能console.time(“计时器的名字”)开启计时器//console.timeEnd(“计时器的名字”);终止计时器2.js中对象的简介对象属于一种复合的数据类型,在对象中可以保存多个不同数据类型的属性对象的分类:1)内建对象:在任何es的实现中都可以使用2
2021-03-28 11:53:54
309
原创 2021-03-20js基础语法总结+质数,循环练习
3.20.2021switch语句:switch(条件语句表达式){case1表达式:语句。。。break;case2表达式:语句。。。break;default:语句。。。break;}执行流程:在执行时会依次将case后的表达式的值和switch后的值进行全等比较,如果比较为true,从当前case处开始执行,false则继续向下比较,如果所有都是false,输出default后的语句While循环:通过循环语句可以反复执行一段代码多次do…while…循环语句do{
2021-03-25 08:24:35
166
原创 2021-03-13 js的基础语法总结第二更
3.13 2021一元运算符:只需要一个操作符+正号对数字结果输出无影响 -号对数字进行取反可以将其他类型数据通过+转为Number类型自增:++自身基础上增加1,a++的值是原变量的值 ++a是自增后的值即a++取旧值,++a取新值,两者都使a自增1自减:通过自减可以使得变量在自身的基础上减1a–是原值,- -a是新值逻辑运算符 布尔值!非 取反操作&&与 可以对符号两侧的值进行与运算 并返回结果||或 只要有一个true就返回true非
2021-03-14 23:45:55
128
原创 2021-03-12 js的基础语法总结第一更
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-03-13 16:27:16
113
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅