每日作业
文章平均质量分 68
Krismile S
可可爱爱,奇奇怪怪
展开
-
6.19作业
query1.是拼接在url后面的参数。2.参数在?后面,且参数之间用&符分隔3.query相当于get请求,可以在地址栏看到参数params1.是路由的一部分。以对象的形式传递参数2.使用params传参只能由name引入路由,如果写成path页面会显示警告,说参数会被忽略3.params相当于post请求,参数不会再地址栏中显示1、query 传参配置的是 path,而 params 传参配置的是 name,在 params 中配置 path 无效。原创 2023-06-19 11:16:59 · 1709 阅读 · 0 评论 -
6.18作业
这样就会影响到所有的实例,所以为了保证组件不同的实例之间data不冲突,data必须是一个函数。1、主要是为了高效的更新虛拟DOM,其原理是vue在patch(补丁)过程中通过key可以精准判断两个节点是否是同一个,从而避免频繁更新不同元素,使得整个patch过程更加高效,减少DOM操作量,提高性能。3、vue中在使用相同标签名元素的过渡切换时,也会使用到key属性,其目的也是为了让vue可以区分它们,否则vue只会替换其内部属性而不会触发过渡效果。删除一条数据时,他的索引也会发生变化,会让数据产生混乱。原创 2023-06-16 19:44:35 · 2386 阅读 · 1 评论 -
6.16作业
2.pushState设置的新的URL可以是与当前URL同源的任意URL;4、是否调用return:computed中的函数必须要用return返回,watch中的函数不是必须要用return。而watch支持异步。ref定义的数据:操作数据需要.value,读取数据时模板中直接读取不需要.value。响应式原理就是指的是MVVM的设计模式的核心,即数据驱动页面,一旦数据改变,视图也会跟着改动。2、功能上:computed是计算属性,watch是监听一个值的变化,然后执行对应的回调。原创 2023-06-16 19:42:55 · 551 阅读 · 0 评论 -
6.15作业
- hook本质是一个函数,把setup函数中使用的Composition API进行了封装。类似于vue2.x中的mixin。-- 自定义hook的优势: 复用代码, 让setup中的逻辑更清楚易懂。原创 2023-06-15 19:46:15 · 722 阅读 · 1 评论 -
6.14作业
watchEffect则可以自动监听函数内部的响应式数据的变化,只要其内部引用的响应式数据发生变化,回调函数就会被调用。2)Composition API:Vue3 引入了 Composition API,允许开发者将一个组件的逻辑分割成可复用的逻辑代码块,提高了组件的可复用性,并且使代码更加清晰简洁。在回调函数中可以处理数据变化的逻辑,也可以手动处理数据,因此灵活性更高。watch可以监听多个数据。1)、功能:接受一个内部值,返回一个响应式的、可更改的 ref 对象,ref对象只有一个属性:value。原创 2023-06-14 17:12:40 · 417 阅读 · 0 评论 -
6.7作业
并且传参的时候,参数名要跟路由后面设置的参数名对应 . /user/:id这个路由配置/user/111,这里的/user/111就是params。d.params可以使用动态传参,动态传参的数据会显示在地址栏中,且刷新页面不会消失,因此可以使用动态params传参,根据动态传递参数在传递页面获取数据,防止页面刷新数据会消失。a标签的作用是从一个页面跳转到另外一个页面,相当于重新加载了页面,还要重新渲染页面,增加了对dom性能的损耗,vue-router不会重新渲染,他会选择陆游所指的组件进行渲染。原创 2023-06-14 08:46:18 · 523 阅读 · 0 评论 -
6.12作业
(1)attrs: 包含没有在props配置中声明的属性的对象, 相当于 this.a t t r s ( 2 ) s l o t s : 包含所有传入的插槽内容的对象 , 相当于 t h i s . attrs。而Vue3中使用的响应式原理是基于ES6的Proxy实现的,通过Proxy对象代理数据,可以实现更高效的数据监听和更新,同时也可以监听到数组的变化。Vue2中使用的响应式原理是通过Object.defineProperty方法对数据进行劫持监听,从而实现数据的响应式更新。原创 2023-06-11 19:36:33 · 566 阅读 · 0 评论 -
6.8作业
Vue2 与vue3 最大的区别是vue2使用选项式api,对比vue3组合式api。在vue3中得setup()中得第二个参数content对象中就有emit,那么我们只要在setup()接收第二个参数中使用分解对象法取出emit就可以在setup方法中随意使用了。响应式原理就是指的是MVVM的设计模式的核心,即数据驱动页面,一旦数据改变,视图也会跟着改动。vue2是把数据放入data中,vue3就需要使用一个新的setup()方法。vue3的响应式原理是由es6中的Proxy所实现的 (数据代理)原创 2023-06-08 16:59:22 · 662 阅读 · 0 评论 -
6.5作业
我们只要将共用的功能以对象的方式传入 mixins选项中,当组件使用 mixins对象时所有mixins对象的选项都将被混入该组件本身的选项中来。在日常的开发中,我们经常会遇到在不同的组件中经常会需要用到一些相同或者相似的代码,这些代码的功能相对独立。1- xxx-enter-active:指定显示的transition。2- xxx-leave-active:指定隐藏的transition。mixin(混入),提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。1- vue动画的理解。原创 2023-06-05 19:53:31 · 363 阅读 · 0 评论 -
6.2作业
表示,父组件可以在这个占位符中填充任何模板代码,如 HTML、组件等,填充的内容会替换子组件的标签。 插槽默认内容 (1)子组件: 插槽默认内容原创 2023-06-02 19:44:37 · 497 阅读 · 0 评论 -
6.1作业
如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就会更加高效。可传递参数有布尔值false,直接写路径'/'或{path:'/'},回调函数。beforeRouteUpdate: 在当前路由改变,但是该组件被复用时调用,可以访问组件实例 this。beforeRouteEnter:因为当守卫执行前,组件实例还没被创建,不能获取组件实例的this。beforeRouteLeave:导航离开该组件的对应路由时调用,可以访问组件实例 this。原创 2023-06-01 20:00:47 · 507 阅读 · 0 评论 -
5.31作业
使用 Keep-alive 可以提高组件的性能,尤其是在组件状态比较复杂或需要较长时间计算的情况下,通过缓存组件避免重复渲染,提高应用的性能。在缓存的组件被激活时触发 activated 钩子函数,在缓存的组件被停用时触发 deactivated 钩子函数。$route.path 字符串,等于当前路由对象的路径,会被解析为绝对路径,如/home/ews。$route.params 对象,含路有种的动态片段和全匹配片段的键值对,不会拼接到路由。$route:获取路由信息 指当前路由实例跳转到的路由对象。原创 2023-06-01 08:06:57 · 476 阅读 · 0 评论 -
5.30作业
1、query 传参配置的是 path,而 params 传参配置的是 name,在 params 中配置 path 无效。Vue Router 是 Vue.js 官方的路由管理器,或者说是SPA(单页应用)的路径管理器。传统的页面应用,是用一些超链接来实现页面切换和跳转的。是路径之间的切换,也就是组件的切换。vue的单页面应用是基于路由和组件的,路由用于设定访问路径,并将路径和组件映射起来。4、params 传参刷新会无效,但是 query 会保存传递过来的值,刷新不变;原创 2023-05-30 20:34:15 · 847 阅读 · 0 评论 -
5.25作业
3. 兄弟之间通信 通过一个事件总线(eventBus 其实是一个空实例),在A组件中通过$on绑定自定义事件 在B组件中通过$emit接收组件。beforeupdate:数据发生变化立即调用,此时data中数据是最新的,但页面上数据仍然是旧的(检测到数据更新时,但DOM更新前执行)。4.通过$parent /$children/$refs $parent指的是父组件实例 $children/$refs是子组件实例。updated:更新结束后执行,此时data中的值和页面上的值都是最新的。原创 2023-05-25 14:39:34 · 563 阅读 · 0 评论 -
5.24作业
actions:保存的触发mutations中方法的方法,可以理解为通过将mutations里面处里数据的方法变成可异步的处理数据的方法,简单的说就是异步操作数据。b.通过获取的引用,父组件可以直接访问该引用子组件的数据和方法,从而实现通信。mutations:存放的是动态修改Vuex的state中保存的数据状态的方法。.ref可以作为父子组件通信的一种方式,通信形式为父组件引用子组件。3.通过获取的原生标签的dom对象,我们可以使用。state 存放的是数据状态,不可以直接修改里面的数据。原创 2023-05-24 16:43:59 · 678 阅读 · 0 评论 -
5.23作业
2.通过获取的引用,父组件可以直接访问该引用子组件的数据和方法,从而实现通信。1.每一个组件都有一个实例属性$refs,用于获取该组件下所有注册的引用信息。(1)数据(定义的data,props,computed等等)3. 存储在 vuex 中的数据是响应式的,当数据发生改变时,页面中的视图也会同步更新。1.在vue中,组件或原生标签上的ref属性用于注册引用信息。.ref可以作为父子组件通信的一种方式,通信形式为父组件引用子组件。3.通过获取的原生标签的dom对象,我们可以使用。(2)dom对象的方法。原创 2023-05-23 18:18:14 · 474 阅读 · 0 评论 -
5.22作业
首先在使用子组件的标签上定义一个自定义事件 在子组件里通过 this.$emit 去调用这个自定义事件 $emit 方法的第一个参数是自定义事件的名字 第二个参数是就是子组件要传递给父组件的变量 最后在父组件接收使用就可以了。在⼦组件的标签上定义属性 ⼦组件通过props来进⾏接受,可以通过数组的⽅式进⾏接受,也可以通过对象的⽅式来进⾏接收,如果⽗组件没有传递属性,⼦组件可以default来设置默认值。3. 存储在 vuex 中的数据是响应式的,当数据发生改变时,页面中的视图也会同步更新。原创 2023-05-22 19:45:18 · 541 阅读 · 0 评论 -
5.21作业
另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。beforeupdate: 数据发生变化立即调用,此时 data 中数据是最新的,但页面上数据仍然是旧的(检测到数据更新时,但 DOM 更新前执行)。i.V-on:click给标签绑定函数,可以缩写为@,例如绑定一个点击函数 函数必须写在methods 里面。updated: 更新结束后执行,此时 data 中的值和页面上的值都是最新的。4.Vue 中创建的指令有哪些,分别有什么作用 (至少写出 10个)原创 2023-05-20 19:31:15 · 31 阅读 · 0 评论 -
5.19作业
1- 数据todos 定义在App中 我们要在app中执行数据的删除 绑定一个监听事件。// this.$emit("自定义事件名",传参【此处可以省略】)父组件 v-bind:del = “methods中定义的del方法”@del="del" @自定义事件名 = "事件处理函数"父组件 v-bind:属性名 = “data的属性”2- $off --- 关闭 清除。1- $on --- 绑定事件。3- $emit --- 触发。参数1:触发的事件名。使用:this.del()原创 2023-05-19 20:09:22 · 28 阅读 · 0 评论 -
5.18作业
created:实在组件实例一旦创建完成的时候立刻调用,这时候页面的dom节点并未完成mounted:是在页面dom节点渲染完毕之后立刻执行,触发时机上created要比mounted创建的更早两者相同点:都能拿到实力对象的属性和方法讨论这个问题本质就是触发的时机,放在mounted请求有可能导致页面闪动(页面dom结构已经生成),但如果在页面加载前完成这不会,出现此情况建议:放在created生命周期当中。原创 2023-05-18 20:29:15 · 51 阅读 · 0 评论 -
5.17作业
Vue.directive('指令名','处理函数')指令名:使用指令时,切记要添加v-指令名处理函数:两个参数el:当前指令所在标签binding:当前指令所在标签的对象信息。原创 2023-05-17 19:59:16 · 30 阅读 · 0 评论 -
5.16作业
object.defineproperty()把data对象中所有属性添加到vm上,为添加的每一个属性都制定了get和set,可以通过get和set对data对象中的属性执行读与写的操作。a.vue是一款用于构建用户界面的javascript框架.他基于html,css,javascript构建,并提供了一套声名式的,组件化的编程模型,帮助高效开发用户界面。b.数据劫持:object.defineproperty()给属性赋值时,程序可以感知到,从而改变属性值。更加方便的操作data中的数据。原创 2023-05-16 19:22:31 · 33 阅读 · 0 评论 -
5.15作业
操作:v-if: 将dom元素创建或删除v-show:控制css中display属性进行显示隐藏编译条件:v-if:惰性的,只有表达式为true,进行编译缓存渲染v-show:无论表达式值是true或者false,都会进行编译缓存渲染编译过程:v-if:局部编译,切换时会重建或销毁组件内部的事件监听和子组件v-show:编译之后基于css进行显示隐藏,dom始终存在消耗:v-if:切换消耗高v-show:首次渲染加载消耗高应用:v-if:切换条件较少。原创 2023-05-15 19:14:46 · 32 阅读 · 0 评论 -
5.14作业
隐式类型转换是JS 引自动进行的类型转换,比如在字符串和数字相加时,JS 会将数字隐式地转换为字符串。Object.defineProperty .只能劫持对象的属性,从而需要对每个对象,每个属性进行遍历,如果,属性值是对象,还需要深度遍历。Proxy 可以劫持整个对象,并返回一个新的对象不仅可以代理对象,还可以代理数组。跨域是指客户端(浏览器),向服务器请求数据时,请求的域名、端口号或协议与当前页面不一致时会出现的一种情况。instanceof 操作符。5.watch有哪些属性,分别有什么用?原创 2023-05-14 19:17:40 · 37 阅读 · 0 评论 -
5.12作业
总的来说,data 用于存储组件内部的数据,computed 用于计算和处理需要从 data中获取的数据,而 watch 用于处理数据的变化,如果你需要在某个数据变化时做一些事情,使用 watch 来观察这个数据变化。如果data是一个对象,对象是引用数据类型,在组件被复用时,就会创建多个实例.本质上这些实例都是同一个构造函数.这样就会影响到所有的实例,所以为了保证不同组件之间的data不冲突,所以data必须是一个函数。data: 组件内部的数据源,可以用来存储和处理组件内部的数据。原创 2023-05-14 17:44:40 · 29 阅读 · 0 评论 -
5.11作业
vue实现双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过object.defineproperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应监听回调.当把一个普通javascript对象传给vue实例作为他的data选项时,vue将遍历它的属性,用object.defineproperty()将他们转为getter/setter.用户看不到getter/setter,但是在内部他们让vue追踪依赖,在属性被访问和修改时通知变化。原创 2023-05-10 19:49:13 · 31 阅读 · 0 评论