
Vue
文章平均质量分 75
RumIV
这个作者很懒,什么都没留下…
展开
-
【Vue】深入理解v-model指令-父子组件数据绑定
在Vue.js中,v-model是一个非常强大的指令,它用于实现数据的双向绑定。本文将通过一个标签选择器组件的例子,详细讲解v-model的工作原理及其在组件通信中的应用。原创 2024-12-30 11:36:19 · 932 阅读 · 0 评论 -
【Vue】Table组件动态最大高度
分别表示页面顶部、底部和页脚的高度,以及可能存在的其他元素高度。在实际项目中,这些值可能需要根据实际情况进行调整。在使用Vue框架开发项目时,经常会遇到需要调整组件尺寸以适应不同屏幕大小或窗口尺寸的需求。获取当前窗口的内部高度,然后减去表格上方、下方和页脚的高度,得到表格的最大高度。事件监听器,以便在窗口大小发生变化时重新计算表格的最大高度。组件,其最大高度会根据窗口大小的变化而动态调整。组件动态设置最大高度,以实现响应式布局。变量,并在组件挂载时添加一个。首先,我们需要在模板中为。原创 2024-05-30 14:06:31 · 1361 阅读 · 1 评论 -
【HTML】页面引用Vue3和Element-Plus
在现代前端开发中,Vue 3 和 Element Plus 是非常受欢迎的技术。Vue 3 是一个用于构建用户界面的渐进式 JavaScript 框架,而 Element Plus 是一个基于 Vue 3 的组件库,提供了丰富的 UI 组件,帮助开发者快速构建高质量的前端应用。在本文中,我们将通过一个简单的示例来演示如何在Html中引用 Vue 3 和 Element Plus。原创 2024-04-24 18:08:28 · 1411 阅读 · 0 评论 -
【Vue】v-model和.sync
Vue中的v-model和.sync修饰符都是用于实现父子组件间数据双向绑定的机制。尽管它们的作用相似,但在使用方式和实现细节上有所区别。原创 2024-04-15 16:40:42 · 1413 阅读 · 0 评论 -
【Vue】动态Icon组件(变量值作为组件名)
【代码】【Vue】将变量值作为组件名称。原创 2024-04-09 14:41:54 · 930 阅读 · 0 评论 -
【Vue】可拖拽侧边栏实现
首先,我们需要在 HTML 文件中定义侧边栏的容器和用于拖拽的元素。在 Vue 组件中,我们将使用 Vue 的响应式系统来追踪侧边栏的宽度,并添加事件处理程序来响应鼠标拖拽事件。在本篇博客中,我们将探讨如何在 Vue.js 项目中实现一个可拖拽的侧边栏。此功能可以通过修改 HTML 和 Vue 组件的脚本来实现。在 Vue 组件的脚本部分,我们将使用 Vue 的响应式系统来追踪侧边栏的宽度,并添加事件处理程序来响应鼠标拖拽事件。在 HTML 文件中,我们需要一个包含侧边栏内容的容器和一个可以拖拽的元素。原创 2024-03-27 17:27:52 · 986 阅读 · 0 评论 -
【Vue】解决watch监听对象类型变量oldVal和newVal相同问题
问题场景</</exportdefaultdatareturnobja1watchobjhandlernewValoldVallog'newVal'log'oldVal'deeptrue</此时,设置deep: true可以监听到obj.a的变化而在打印的结果发现新值和旧值却是一样的。转载 2024-02-23 17:55:13 · 587 阅读 · 0 评论 -
【Vue】IP地址输入框
效果使用<template> <IpInput ref="ipInput"></IpInput></template>this.$refs.ipInput.getIP("10.90.15.66");const ip = this.$refs.ipInput.value.getIP();console.log(ip);代码<template> <div v-for="(item, index) in ipAddre原创 2023-10-24 14:29:51 · 948 阅读 · 0 评论 -
【Vue】如何在Vue中停止Watch的监听
通过调用stop函数,你可以停止watcher的执行。请注意,这个方法适用于Vue 3.0中的watch,在Vue 2.x中,删除watcher的方式略有不同。对于Vue 2.x的watch,你可以使用unwatch函数来删除watcher。但是请注意,这些方法都是Vue的内部API,可能会在将来的版本中发生变化。// 只要将 flag 声明的函数调用就可以结束监听了。原创 2023-10-17 16:31:56 · 0 阅读 · 0 评论 -
【Vue】基于Cropperjs的图片裁剪对话框
设置裁剪区域的拖动方式,可以是"move"、“resize"或"both”。:设置裁剪视图模式,1 表示方形裁剪,2 表示比例裁剪,3 表示填充裁剪。是一个功能强大的图像裁剪库,可以在Vue项目中实现图像裁剪的功能。:设置裁剪区域的比例,即裁剪区域的宽度和高度之比。:设置预览区域的元素选择器,用于显示裁剪后的图片。:设置初始比例,即裁剪区域的宽度和高度之比。// 设置视图模式为限制在裁剪框内。// 将需要裁剪的图片传进来。// 自动选择裁剪区域的大小。:设置自动裁剪区域的大小。导入cropper库。原创 2023-10-17 15:28:47 · 501 阅读 · 0 评论 -
【Vue】鼠标悬停按键效果
Vue实现鼠标悬停效果原创 2023-10-17 14:44:23 · 1190 阅读 · 0 评论