- 博客(32)
- 收藏
- 关注
RSS订阅原创 vue3 + ts + vite,自定义指令，使用权限全局控制按钮显示隐藏
1. 创建自定义指令在 index.ts 文件中创建自定义指令。这个指令将根据用户权限控制按钮的显示和隐藏。2. 在main.ts中全局注册指令在 main.ts 文件中全局注册自定义指令。3. 在其他页面使用指令在其他页面的模板中，使用 v-hasPermi 指令来控制按钮的显示和隐藏。例如：
2024-03-28 14:41:14
1083
原创 vue3 + ts，怎么在页面上展示富文本编辑器传过来的值
函数中创建一个可响应的数据，用于保存富文本编辑器的内容。接下来，将该数据绑定到富文本编辑器组件，并在模板中显示其内容。函数中，你可以监听富文本编辑器传递的值的变化，并将其赋值给。钩子中，我们模拟了富文本编辑器传递的值，并将其赋值给。在页面上展示富文本编辑器的内容时，我们使用了。首先，安装并导入所选择的富文本编辑器库，并在。组件作为富文本编辑器，并绑定了。在上面的代码中，我们使用了。首先，在模板中创建一个具有。创建一个对该元素的引用。在上面的代码中，我们使用了。数据，并将其渲染在具有。
2024-03-22 15:28:35
259
原创 vue3 子组件给父组件传值，并且在父组件中使用
的自定义事件，并将消息作为参数传递给父组件。父组件监听了这个事件，并在事件处理程序中将接收到的消息赋值给一个变量，然后在模板中显示出来。父组件通过在子组件标签上监听子组件触发的自定义事件，并在事件处理程序中处理传递过来的数据。方法触发一个自定义事件，并将需要传递的数据作为参数传递给父组件。
2024-03-22 15:22:01
251
原创 vue3父组件给子组件传值，并在子组件接受
在子组件中使用props来接收父组件传递的数据。中，Vue 3 已经隐式地为你创建了一个组件。在父组件中定义需要传递给子组件的数据。在这个修改后的代码中，我们使用了。来定义 props，而不是在。
2024-03-22 15:19:21
390
原创 Vue 3项目中结合Element Plus的＜el-menu＞和CSS3创建锚点，以实现点击菜单项时平滑滚动到对应的锚点目标
确保已经安装了Element Plus库。可以使用npm或者yarn进行安装，具体步骤与上文提到的相同。方法来处理菜单项的选择事件，使得点击菜单项时能够平滑滚动到对应的锚点目标。在你的Vue 3项目中引入所需的Element Plus组件和样式。值对应，这样点击菜单项时页面就会平滑滚动到相应的锚点目标位置。属性为对应的锚点目标的id。在页面中添加与菜单项。
2024-03-22 15:15:18
760
原创 vue3 + ts +element-plus + vue-router + scss + axios搭建项目
本地环境：node版本：20.10.0。封装axios，封装路由vue-router，封装element-plus
2024-03-21 14:11:36
1517
原创 npm i 安装依赖时报错：C:\Program Files (x86)\Git\cmd\git.EXE ls-remote -h -t ssh://[email protected]/sohee-lee7
再重新执行npm i命令。
2024-01-16 14:44:26
623
原创 vue3 + ts + echarts图例点击事件（legendselectchanged事件）
在 ECharts 中，可以通过监听图例的点击事件来实现相应的交互。当图例被点击时，可以捕获这个事件并执行相应的操作。在 legendselectchanged 事件上添加了一个监听器，当图例被点击时，会触发这个事件，可以获取到点击的图例信息，然后执行相应的操作。
2024-01-11 14:04:43
905
原创 一个页面同时多次引用同一个echarts组件，报错There is a chart instance already initialized on the dom解决
报错There is a chart instance already initialized on the dom，出现这个问题是因为这个图表已经在页面上初始化了，如果多次引用就会重复，解决思路如下：在echarts组件页面上，通过获取id初始化图表，如果每次id不同，那么就不会出现这个问题，所以只需要动态获取Id就可以解决此问题
2024-01-03 17:17:48
544
原创 element plus树形控件-自定义样式，给树形控件的每个子节点前都添加小圆点
通过使用 Element UI 提供的插槽，我们在每个节点的文本前面添加了一个小圆点。如果节点的层级（level）大于 1，就显示小圆点，这样就不会在根节点前添加小圆点。
2024-01-03 17:02:31
695
原创 vue3 + ts，对象里的属性求和
vue3 + ts，对象里的属性求和使用vue3 + ts，将data1中键名A，键名B赋值给对象data2的name值；将data1的每一项的A的值的总和赋值给data2的A.value值；将data1的每一项的B的值的总和赋值给data2的B.value值
2023-12-27 16:27:14
575
原创 Vue 3 + TypeScript的方式，将对象的键名和键值提取到数组中
1、Vue 3 + TypeScript的方式，将对象的键名和键值提取到数组中。2、使用Vue 3 + TypeScript的方法，将。的键名（A、B、C）和对应的值赋值给。
2023-12-27 14:19:27
568
原创 vue3中，点击父组件，刷新子组件的数据（父组件内刷新子组件）
3、点击父组件，刷新timer。注意：子组件里面不需要任何操作。1、子组件上绑定timer值。2、定义timer变量。
2023-12-27 11:14:14
1242
1
原创 el-form 动态表单增减项 （vue+element ui）
el-form-item（表单项）循环，绑定的数组写在form当中。1、点击”+“，弹出弹窗，新增一项，点击”-“，删除当前项。1、点击新增，弹出新增弹窗，添加表单项。2、点击”-“，删除当前表单项。
2023-09-20 17:53:23
1919
1
原创 element ui中select多选框change选择获取选项的所有字段信息
事件，此时可以通过该事件的回调函数来获取选中的选项的所有字段信息。当多选框选项发生改变时，会触发。在 Element UI 的。事件来获取选项的所有字段信息。
2023-09-13 17:41:56
2788
2
原创 JavaScript九大数据类型详解
分类：简单数据类型（基本类型/值类型）：字符串（String），数字（Number），布尔（Boolean），空（Null），未定义（undefined），symbol 复杂类型数据（引用类型）：数组（Array）,对象（Object）,函数（function）简单数据类型详解：数字类型（Number） 整型 整数，包括正整数，负整数，0 浮点型 小数，例如:0.5 .6 1.0 NAN（会在出错的情况下出现） NaN的特性:NaN和任何数...
2023-08-21 11:06:22
77
1
原创 Set数据结构及其常用方法详解
Set数据结构作用：自带去重功能(基本数据类型)。类数组,可以存储任意数据类型。用法：new Set([数组/类数组])示例代码：<script> // Set自带去重功能，只支持基本数据类型 let arr = [2,1,3,2,4,5,2,5,1,function(){},function(){}]; let arr1 = new Set(arr); console.log(arr1);//{2, 1..
2023-08-21 11:05:28
122
1
原创 js数组方法详解
js数组的方法详解、push、pop、unshift、shift、splice、concat、reverse、slice、indexOf、join、every、some、filter、map、forEach、sort、选择排序法、冒泡排序法
2023-07-26 18:18:19
63
1
原创 vue组件传值（父子组件传值、子父组件传值、非父子组件传值）
vue组件传值，vue组件传值，父子组件传值（父子组件通信），子父组件传值（子父组件通信），非父子组件传值（非父子组件通信、兄弟组件传值、兄弟组件通信）
2023-03-24 15:28:26
113
原创 Vue表单元素绑定数据（取值和赋值）
表单元素绑定数据：v-model非表单元素绑定数据：v-html：指令当做标签或者组件的属性使用作用：数据绑定（可以识别字符串标签）v-text：作用：数据绑定(不识别字符串标签)示例代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equi...
2022-04-01 19:54:07
375
原创 数组的去重方法总结
1、删除法<body> <!-- 删除法 --> <script> var arr = [1,1,4,6,3,7,3,9,3,0,2,2,5]; // 1、循环所有的数组项 for(var i = 0;i < arr.length;i++){ // 2、循环当前数组项后面的所有数组项 for(var j = i+1;j < arr.length
2022-03-30 15:24:45
1657
原创 ECMA6对象的新增方法详解
新增方法:assign:作用：assign,将参数2...参数n的值拷贝到参数1上,并生成的新的对象。注意：基本数据类型深拷贝，复合数据类型浅拷贝 深浅拷贝：（深值浅址）用法：Object.assign( 参数1,参数2，参数3 )示例代码1：（将参数2，参数3的值拷贝到参数1上）<script> // assign,将参数2...参数n的值拷贝到参数1上,并生成的新的对象。(基本数据类型深拷贝，复合数据类型浅拷贝) ...
2022-03-05 15:43:10
238
原创 ECMA6新数组的方法详解
数组天生的一个缺陷： 给Array中传入一个参数n的时候，结果为：长度为n的空数组给Array中传入两个或两个以上参数的时候，结果为：[参数1，参数2，参数3...]示例代码：<SCRipt> let arr = new Array(); console.log(arr);//空数组 // 写入一个参数的时候 let arr1 = new Array(3); co...
2022-03-05 14:14:16
187
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人