自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(13)
  • 问答 (1)
  • 收藏
  • 关注

原创 数组的find方法与数组元素类型问题

在进行原生项目开发时需要大量的使用dom操作,过程中遇到表格功能制作难免会用到查找dom节点的操作。发现find方法要求数组元素需要是数值型、字符型或者引用数据类型等数据类型,而不能是dom节点,虽然dom节点可以作为数组元素,但不可以使用查找方法。数组的find方法用于查找满足条件的第一个数组元素,是ES6的查找方法。注:该操作仅调试是否能够运行find方法,21行的undefined是因为数组元素为数组,为引用数据类型初步比较地址不同导致查询不到。

2023-08-21 18:28:44 196

原创 Vue组件在数据内容不变时触发侦听属性

在制作九宫格相册显示效果时,在子组件中遍历渲染了父组件传来的数据区的图片。想要点击图片时放大该图片,需要对每个图片添加单击事件,点击事件中将能识别本图片的信息发送给父组件进行处理。这个时候父组件接收到每次点击图片的信息,使用侦听属性能够方便的处理每次单击的图片。但是如果一直点击同一图片,父组件从子组件中接收的数据相同,接收的变量不发生变化,侦听属性无法触发从而。:可以把传送来的字符串数据改为只有一个元素的数组,子组件向外传送的数据的类型变成了引用数据。

2023-07-14 10:10:40 463

原创 Vue组件各个属性执行顺序问题

后来该变量在mounted中被赋值,而后在watch侦听属性中使用立即侦听时使用了该变量却显示为null,后发现这关系到各个组件属性执行顺序问题。关于Dom结构的渲染,在组件中可以通过el,render,template进行渲染,在这三者中render函数优先级最高,其次是template模板,如果二者都没有,则通过挂载点el进行渲染。组件内部各个属性主要有props、data、computed、watch、created、mounted、methods。会处理数据对象中的所有属性,并将它们添加到。

2023-07-13 09:05:56 965

原创 JS中Map数据类型和map方法

map方法是针对数组的方法,该方法会返回一个新的数组,且不会改变原来的数组,新数组的数组元素是原数组元素经过map方法内部处理后的值,其本质是遍历一遍原来的数组同时根据要求得到一一对应的数组元素构成新数组。Map是键值对的集合,用法类似与对象,是一种ES6新增的数据类型。该数据类型的使用会占用较大的内存而得到更高的速度。使用size来得到集合中包含键值对的数量;使用for-of和forEach方法遍历自身,遍历时。Map实例还可以使用has来查询是否存在键名,该方法会返回一个。

2023-07-11 08:43:12 744

原创 Vue组件嵌套制作手风琴问题

current赋值为当前类名为title的节点,这保证了每个子组件中有了独一无二的标签。但如果没有完整数据,那么直接在父组件下写入子组件是比较方便的做法,此时问题的核心就成了如何为几个相同结构的子组件添加不同的标签来加以鉴别,从而完成每个子组件的单击事件并完成父组件传来的默认打开功能。该代码中添加类时所进行的逻辑判定中有两个变量,current和currentClick,前者是每个组件进行区分所用的自定义标签,currentClick是当前点击的标题,意思是当点击的标题和当前的标题相同时则展开内容。

2023-07-09 21:31:29 255

原创 如何理解JavaScript中Sort排序函数

插入排序基本思路是从数组下标0位置开始,在向后遍历的同时与之前的数组元素进行比较并排序,其平均复杂度为O(n^2),又因为该排序方法不涉及新的数组,是种原地排序方法,空间复杂组为O(1)。快速排序基本思路是在数组中取一个数组元素作为基准值,将和基准值不同的值根据大小分布左右,后再依次递归遍历左右两个部分完成排序,其平均复杂度为O(Sort不带参数的方法通常是在数组元素为字符串类型数据时使用,此时数组元素转换为各个字符的Unicode编码进行升序排序。(1) sort函数的用法。一、sort函数的用法。

2023-07-05 17:27:25 112

原创 Vue组件插槽中数据的传递问题

在组件使用中需要在使用插槽(添加了v-slot)中指定目标插槽的name取值来进行对接,同时自定义一个变量接收插槽中携带的数据。组件内部能够使用插槽标记对<slot></slot>,添加插槽则可以在该组件标记对中放置数据。同样在插槽标记对内部同样可以使用自定义属性携带数据。在该代码中两处使用了slot标记对,标记对中均传入了数据item和index,且使用item与index自定义属性携带。使用插槽进行数据传递,可以在代码中定义自己想要的表单效果,而不是仅仅只渲染规定好的数据和结构,增加了组件的通用性。

2023-07-03 21:41:09 941

原创 Vue组件实现评论区项目中的点赞功能

评论区点赞功能最常见的设计:(1)存在有点赞和踩两个按钮。 (2)个人对单个视频只能选择点赞和踩之中的1个,且多次点击同一选项其累加数量只能加1。 (3)在选择完成后,其选项图标高亮、选项数量会加1。 (4)当尝试全点时会取消先选中的选项,使先选的选项高亮效果和其累加的数量转移至后选的选项。在组件的数据区每个评论的数据中需要有dianzanNum、caiNum、feedbackChose三个变量。前两者分别记录点赞和踩的现有数量;feedback默认值为0,且取值还有-1、1,规

2023-07-02 21:41:25 1709

原创 Vue组件的通信---兄弟组件间的通信

假定有A、B两个组件要进行通信,组件A向组件B发送数据,则要将A组件中的数据通过emit方法发射出去并由父组件接收,而后被父组件再通过自定义属性的方法完成向B组件数据传输。组件B向组件A发送数据的方法相同。前两部分主要讲的是组件嵌套时其间的通信问题,组件之间除去嵌套,并列也极为常见。解决这类组件的通信问题,在这里学习两种方法:1、使用父组件作为兄弟组件通信的中转点;其方法是通过新建的bus实例来使用emit方法发射数据,目标组件接收数据需要在mounted钩子函数内部使用bus实例的on方法完成。

2023-07-01 21:06:53 1150

原创 Vue组件间的通信---子组件向父组件传递数据

同理每当使用button按钮对微调器更改时所改动的current值也被侦听并通过emit方法向外传出,最后在父组件方法中接受emit方法传出的current值完成子组件向父组件传值。在set(newCurrent)方法中,引入每次current变量发生变化后的新值,并通过emit方法向外传出,最后父组件接受并完成数据传递。(2)将v-model指令绑定在组件上:为组件制定与之双向绑定的父组件数据区变量。是常用的组件间通信的常用方法,可以直接使用v-model绑定组件实现功能。

2023-06-30 09:53:41 308

原创 组件之间的通信---父组件向子组件传递数据

注意:在子组件的template模板中input双向绑定了一个名为current的东西,而不是直接绑定value,这是因为在props接收的数据不能在子组件中赋值,即props接收的数据在子组件中是只读的,这回导致input无法正常使用,所以需要一个current对value进行接收。组件的种类有局部注册组件与全局注册组件,局部注册的组件常常用在局部注册的内部使用,这个时候就需要处理好该两者组件之间的通信问题。下列为父组件代码,现在的目的是将父组件中data中的数据传递进入子组件中。

2023-06-28 17:52:09 170

原创 css课后笔记:盒属性

课后回顾

2023-02-10 08:39:50 54

原创 CSS课后笔记:背景类&列表类属性

课后css背景类与列表类属性小结

2023-02-08 09:09:36 87

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除