- 博客(85)
- 收藏
- 关注
RSS订阅原创 Vue面试题（一）
1、双向数据绑定的原理不同 vue2使用的是Object.defineProperty（不能监控数组下标变化的能力的、以及对象的属性值） vue3使用的是proxy代理2、vue2选项式API：在中小项目中，vue2的选项式API也是不错的选择，但是在大型项目中，vue3的组合式API会表现的更加优秀。 vue3组合式API优势 ：一个业务需要的数据方法，生命周期函数都在一起，配合hooks函数的使用，能让代码的复用性，条理性都很高，维护起来也很方便3、vue3 其他的运行时增强
2022-10-24 21:00:11
1474
1
原创 Vue3中使用pinia
当我们接收到pinia数据且对其数据进行了大量修改又想还原时，调用此方法就可以将接收的pinia数据全部重置还原。箭头函数的使用：(ps:虽然鼓励但是依然提供了非es6玩家的使用方式 内部可以用this代表state)说明成功修改了pinia里面的数据，且界面刷新证明这种直接修该pinia数据的方式依然是响应式数据。在pinia中没有提供mutaion 因为Actions就够了(它可以异步同步的统一修改状态)中的store是自己设定的接收变量，重点是。在之前的案例中修改了pinia的name属性值。
2022-09-22 19:55:33
14885
3
原创 Vue3路由配置createRouter、createWebHistory、useRouter,useRoute
Vue3和Vue2基本差不多，只不过需要将、从中引入，再进行使用。
2022-09-22 18:31:19
17716
1
原创 vue3中的isRef toRef toRefs readonly
isRef 判断是否为响应性变量用法：isRef("变量"),点击按钮控制台打印从obj.name不是响应式数据看出。
2022-09-21 19:43:25
832
原创 Vue3中的状态驱动的动态CSS、注册组件
data(){},setup(){}});let Box1 = defineAsyncComponent(() => import("./Box1.vue")) //注意3.2之后不用引入defineAsyncComponentBox1},}
2022-09-21 16:18:01
1273
原创 vue3中setup的两个参数 props，context (attrs，emit，slots)，vue3中的双向数据绑定自定义事件emit和v-model
这是父组件的name：{{obj.name}}
2022-09-20 20:29:27
7728
原创 Vue2.0到3.0的过渡，setup，ref函数，reactive函数，计算属性computed、监听属性watch
均要配置在中，若要使用里面的数据，可以用将其返回出来2、若在中返回的是一个，则对象中的、在模板中均可直接使用例如界面效果，以及点击按钮后控制台打印的内容直接属性写入标签中即可，不再使用和函数以及如。
2022-09-18 15:26:42
1012
原创 Vue的路由守卫
导航守卫执行顺序：beforeRouteLeave < beforeEach < beforeRouteUpdate < beforeEnter < beforeRouteEnter < beforeResolve < afterEach。
2022-09-13 20:49:11
1583
原创 Vue中的query传参和动态路由传参
2种传参:1、go2、this.$router.push({path:"/xx",query:{name:"karen",pwd:123}})//在路由匹配的组件中获取数据:mounted(){let queryObj=this.$route.query}设计:const router=new VueRouter({ routes:[ {path:"/home/
2022-09-12 17:46:39
2121
原创 Vue 依赖注入 - Provide/Inject
组件向组件传递数据， 可以采用父子props层层传递，也可以使用bus和Vuex直接交互。在Vue2.2.0之后，Vue还提供了Provide/Inject选项传递给子孙组件（provide传值有），接受效果图：这样我们就成功将值进行了传递，当我们点击按钮时会产生以下效果。
2022-09-12 14:29:41
497
原创 Vue脚手架中的axios的引入，网络事件代理配置
首先去终端安装axios，指令：npm i axios然后在文件中引入 import axios from "axios”,便可以直接使用axios或者将axios写入原型中在进行axios请求时使用。
2022-09-07 21:07:00
3241
原创 Vue的侦听器
一般是提供给模板事件和其他方法(比如钩子函数)使用,如果在模板中使用了方法,而且不是事件,如果模板中的渲染的任意数据源改变了 它都会重新调用。会把计算的结果缓存起来,并监听计算过的数据源 如果监听的数据源发生变化才会重新计算(没有监听的属性发生变化 模板会重新渲染)计算属性,属性侦听器,方法,过滤器有什么区别?2、修改了引用数据内部的属性值:页面会重新渲染,但是侦听器属性不会触发。当侦听器监听的属性发生变化时,就会调用watch中对应的方法。分开设计:计算属性,属性侦听器,方法,过滤器。
2022-09-04 20:17:18
367
原创 Vue组件的八个钩子函数
1、生命周期函数 (c语言中有一类系统回调的函数然后执行业务 叫做钩子)2、 在某一种条件成立的时刻 系统会去调用的vue中设定的函数 这些函数都叫做:生命周期函数3、当前vm实例在创建到销毁的过程中 会去调用的函数基本分为四类。
2022-09-04 17:02:49
3803
原创 Vue过滤器 filters
主要用于数据展示之前的处理过滤器只能用在。很明显能看出两者的效果一样，但写法不同。中，将函数写在filters里面。
2022-08-31 20:26:24
225
原创 Vue循环渲染 v-for和v-if，key
效果图常规的方法会引起一个问题：v-if每次判断成功时都会 再创建一个div来装得到的数据，相当于我们用了两个div来装为了解决这一问题我们可以使用冰元素这样我们就可以解决这一问题。
2022-08-30 22:29:18
481
原创 Vue样式绑定
1、将，属性值为true（显示）和false（隐藏）。利用开关思想就可以写出一个简单的按钮换色效果界面图点击按钮之后就会显示如将以上代码 添加html代码添加Vue中的data对象的属性 classname:"bgc1"界面就会多出一个3、将类名写在[ ]里，和第二种类似，但都会生效（一般不用这种）...
2022-08-30 21:43:59
1197
原创 Vue事件
在methods中写方法,供事件或者别的方法内部调用（es5、es6的方法都可以）。：1、v-on 2、@，两种方法后面都跟事件类型,值就是methds中的方法,可以加小括号也可以不加点击第一个按钮控制台会打印1111点击第二个按钮控制台会打印2222鼠标进入第三个按钮控制台会打印3333鼠标移出第三个按钮控制台会打印4444。...
2022-08-30 19:51:13
215
原创 Vue基础指令
在标签尖括号中使用插入js表达式:变量,函数调用,三目运算等等,插值表达式中的标识符 代表vue对象中的data的属性名或者methods中的方法名页面显示内容。
2022-08-29 19:39:22
127
原创 用js写出数据结构中的自定义队列，利用队列思想写出一个击鼓传花的游戏函数，优先级队列
// 1.入队}// 2.出队}// 3.返回队首元素front(){}// 4.判空}// 5.队列元素的个数size(){}}i < 5;i++) {queue.enqueue(i) //入队5个元素}//出队//队首元素//判空//队中的元素个数打印的结果为。
2022-08-22 20:06:09
729
原创 用js写出数据结构中的自定义栈，利用栈的思想，使用js将十进制数转换成任意进制数（2，8，16进制）
使用原型来封装方法this.items=[]// 栈中的属性}// 栈相关的方法// 压栈操作}// 出栈操作pop(){}peek(){ //查看栈顶元素}// 判断栈中的元素是否为空}// 获取栈中元素的个数size(){}}
2022-08-22 19:23:36
309
1
原创 GET请求
1、GET请求传参数给后端2、参数会拼接到url中,不安全,速度快3、后端返回的数据 前端是xhr对象接受了,程序员用js语言来使用返回的数据3.浏览器的地址栏[只能]发送get请求,接受的数据会直接读取渲染,如果解析失败会下载。...
2022-08-07 15:45:13
1087
原创 egg中的一些基本使用注意事项以及如何跨域（CORS）、JSONP、Proxy
路由是描述请求URL和具体承担执行动作的Controller的对应。说的直白点，就是用户访问不同的路径时应该有不同的Controller去响应不同的内容。可以调用分别调用请求（参数1为请求的URL，参数2为回调函数（这里只是传参））：1、注册路由时 路由名（URL）不要跟静态文件名冲突 不然会优先访问静态资源2、如果注册的路由是，这表示所有的都访问的是该路由的路径数据。但是遵循注册先后顺序，在注册它之前有别的路由则依然是访问之前注册的路径数据。......
2022-08-04 19:40:12
497
原创 js中的promise函数（ES6）
1、它被设计成一个全局构造函数2 、这个函数创建出来的对象 是一个特殊的数据容器3、这个数据容器内部有三种状态: 等待 ==>产生的正确数据 产生了错误的数据。
2022-08-02 20:25:59
335
原创 node.js中的跨域以及同源策略，如何解决
浏览器为了用户的信息安全,网页中有一个网络请求技术AJAX在网络请求时请求的网址和当前页面的网址不是同一台服务器就会被拒绝接受服务器发送的数据。
2022-08-01 20:34:52
253
原创 node.js中的各种路径，网页的加载流程
当前页面的路径(写这个路径的文件的页面是在本地打开的==>)(写这个路径的文件的页面是在本地打开的==>)"file//c/"
2022-07-28 19:25:13
204
原创 node.js的路径、fs模块
全局变量__是一个字符串,代表当前js文件所在目录的路径(绝对路径)全局变量__是一个字符串,代表当前js文件的路径(绝对路径)
2022-07-28 17:58:52
199
原创 点击表格列变色，让表格的偶数排变色，点击表格的行让其变色
点击任意一个单元格，会自动使该单元格所在位置的一竖列单元格变红。CSS、HTML代码一致。CSS、HTML代码如上。
2022-07-14 19:24:08
865
原创 DOM中获取元素的方式，以及一些基本操作
H5之前的技术document.getElementById //查找速度最快 （id属性）没有返回nulldocument.getElementsByClassName （class属性） 没有返回[ ]空数组document.getElementsByName （name属性） 没有返回[ ]空数组document.getElementsByTagName （标签属性） 没有返回[ ]空数组H5技术document.querySelector //符合选择器的第一个元素 没有返回null
2022-07-14 16:28:08
362
原创 es6--模块化开发
js代码有3种方式把js脚本写在页面中 1.行内式:js引擎要去执行的标签的某些(事件)属性中 2.嵌入式 3.导入 src的地址是一个js的路径 会加载js编码(jsonp)（1）概述ES6 引入了模块化，其设计思想是在编译时就能确定模块的依赖关系，以及输入和输出的变量。ES6 的模块化分为导出（export） 与导入（import）两个模块。（2）特点ES6 的模块自动开启严格模式，不管你有没有在模块头部加上 use strict;。模块
2022-07-12 19:28:17
490
原创 js是什么语言，es6--class类
js是一个基于面向对象设计的单线程的静态脚本语言. 面向对象 ( 类 实例对象 继承 封装 多态 ) 基于面向对象设计 本质没有继承 类 等等语法 但是按照自己的语法特征(原型) 单线程 代码只能一个业务一个业务的执行 静态 var a={}; var re=a*20; 脚本语言 > 嵌入式语言 灵活1）概述在ES6中，class (类)作为对象的模板被引入，可以通过 class 关键
2022-07-12 19:03:51
100
原创 se6--箭头函数
箭头函数提供了一种更加简洁的函数书写方式。基本语法是：参数 => 函数体 (参数) => {函数体}语法注意事项 1、当箭头函数没有参数或者有多个参数，要用 () 括起来。 2、当箭头函数函数体有多行语句，用 {} 包裹起来，表示代码块，当只有一行语句，并且需要返回结果时，可以省略 {} , 结果会自动返回。 3、当箭头函数要返回对象的时候，为了区分于代码块，要用 () 将对象包裹起来箭头函数中识别不了this、argumen
2022-07-12 16:02:44
160
原创 es6--数组
（1）数组创建Array.of()：将参数中所有值作为元素形成数组。console.log(Array.of(1, 2, 3, 4)); // [1, 2, 3, 4] // 参数值可为不同类型console.log(Array.of(1, '2', true)); // [1, '2', true] // 参数为空时返回空数组console.log(Array.of()); // []Array.from()：将类数组对象或可迭代对象转化为数组。// 参
2022-07-11 20:26:10
394
原创 es6--对象
（1）对象字面量属性的简洁表示法：ES6允许对象的属性直接写变量，这时候属性名是变量名，属性值是变量值。const age = 12;const name = "Amy";const person = {age, name};console.log(person); //{age: 12, name: "Amy"} 方法也可以简写：const person = { sayHi(){ console.log(
2022-07-11 20:18:49
213
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人