- 博客(47)
- 收藏
- 关注
RSS订阅原创 canvas制作自定义标签-npm插件x-canvas-draw
x-canvas-draw功能简介。1、可自由添加图片、文字。2、可自由移动元素位置。3、可自由调整元素大小。
2024-10-14 13:35:29
218
原创 v3+antd+echarts的bug记录
进行绑定，如果使用 reactive 绑定的话会出现 修改完日期，但是页面数据不会更新的bug。使用该组件时绑定数据必须使用。
2024-04-09 12:42:53
362
1
原创 Promise相关理解记录
Promise是一个构造函数，调用时需要使用new关键字Promise是解决回调地狱的一种异步解决方式Promise有三个状态：pending(进行中)、fulfilled(成功)、rejected(失败)Promise的状态只会从 pending→fulfilled 或者 pending→rejected ，并且不会再改变。
2024-02-24 22:32:12
455
原创 安全相关问题记录
一、预防XSS攻击校验 输入时进行格式校验 过滤 过滤<script>,<iframe>等特殊标签 过滤onclick,onerror,onfocus等js事件属性 编码转义 对需要渲染的内容做编码转义 限制 限制输入长度 cookie设置成 http only
2024-02-24 17:31:52
590
原创 在项目中使用CancelToken选择性取消Axios请求
Axios 提供了 CancelToken 类来创建取消标记。取消标记实际上是一个包含标记和方法的对象。
2024-02-24 16:01:09
904
原创 简易版-图片懒加载-原生js
原理：将需要懒加载的图片src设置为loading图片，然后将data-src设置为图片原路径。待页面滚动到合适距离之后，就加载相应的图片。
2024-02-20 14:17:07
432
原创 Vue3中的自定义Hooks
组件复用性更强：通过Hooks可以使得组件的一些逻辑可以更好地进行封装和复用更好的逻辑分离。Hooks有助于组件内的业务逻辑更加清晰明了，从而减少代码耦合度。更高的代码可读性。使用Hooks使得函数组件的可读性更高，在保证性能和灵活性的情况下，增加了代码的可读性。
2024-01-24 18:01:25
558
原创 Vue3组件通信相关内容整理
props/emit/mitt/v-model/$attrs/$refs-$paret/provide-inject/slot-具名插槽-插槽传值(作用域插槽)/pinia
2024-01-24 17:52:18
1342
原创 在vue.draggable.next拖拽差中使用组件时遇到的问题
vue.draggable.next 中文文档 - itxst.com问题描述：在draggable标签中定义的组件，通过ref不能正确拿到相应数组在vue3中定义组件的ref，如果有多个相同名称的组件，会将ref.value的值变为数组。在vue.draggable.next提供的draggable标签中定义组件，如果有多个相同名称的组件，ref.value的值为循环后的最后一个数据。2、子组件代码3、页面打印结果 代码如下：打印结果：
2024-01-22 11:46:40
954
1
原创 v3+ts——3、路由模块（包含权限验证）
router文件夹actionRouter.ts 需要权限验证的路由filterRouter.ts 过滤不需要在侧边栏中显示导航的路由index.ts 路由入口staticRouter.ts 不需要权限验证的路由 任何人都可以访问utils文件夹router.ts 编写路由守卫。
2023-10-17 16:09:37
339
原创 v3+ts——2、基础布局
使用后台管理系统通用布局，在ElementPlus中找到组件-Container 布局容器具体代码如下这一步过后，页面上就已经有了一个基础的布局，注意调整一下css样式，具体效果如下。
2023-10-17 14:41:22
147
原创 记录一下el-calendar在不同时区下会出现的Bug
由于项目的需要，用到了日历组件，在北京时区下一切都很正常，直到切换时区后(下图案例为，这个组件就出现了一些问题该问题的原因：new Date() 会获取根据你电脑设置的时区来获取相应的时间由于项目需要的解决方式为：将此组件设置为以北京时区为准。但是我在网上搜索了一堆相关的解决方式，都不能够解决我的问题，所以我自己进行了一些细微的更改（如果你有更好的方式，欢迎指导）虽然这种方式很笨，但是有效。
2023-06-13 16:56:08
662
原创 表格数据前端做缓存
在获取数据的方法中接受一个参数，用来标识需不需要清空数据（如果是操作完成需要刷新数据就传这个参数，如果是简单的切换tabs标签页就不需要传）//1. 第一步 读取数据// 读取缓存中的数据// 如果不需要刷新数据，就会从缓存中读取数据if (data!return// 如果需要重新获取数据，先将缓存中的数据清空}...}如果此时是第一次获取数据，或者需要重新获取数据，就调用相应接口获取数据，并将其存储到本地...// 第二步 获取数据并存储// 如果没有缓存的数据if(!
2022-11-01 17:31:48
1162
原创 popstate、pushState、replaceState操作浏览器历史记录
pushState和replaceState都属于history的操作方法。
2022-10-26 16:35:31
775
原创 输入框禁止复制粘贴
禁止文本被选中，可以使用css样式。如果要禁止粘贴，就要用到事件。在原生事件中 在触发事件中调用。paste 是在进行。vue中可以直接绑定。
2022-08-25 11:43:57
3544
原创 在VUE3中引用Element-ui
在Vue3中引用Element-ui的方式与Vue2中引用的方式有一些区别 通过npm安装 element-plus 注意不是 element-ui第二步：在main.js中引入注意！！！ 在 .use(ElementPlus) 必须写在 .mount('#app') 之前否则控制台会报错，引用也不会成功...
2022-07-07 11:52:32
1545
原创 在关闭弹窗后清除表单数据
给表单加上 ref="form"关闭弹窗的事件里加上以下代码即可this.$refs.form.resetFields()
2022-03-18 11:29:05
968
原创 element-ui的el-dialog组件内容在阴影下面
只需在 el-dialog 标签上添加上以下代码即可:append-to-body="true"
2022-03-15 19:48:17
2523
3
原创 vue-cli中兄弟组件的传值
组件之间的传值分为：子传父、父传子、兄弟组件传值、vuex在一般的小型项目中没有必要使用到vuex兄弟组件之间的传值需要用到一个中间件(vue的实例对象)，在vue-cli中注册中间件的方式如下：在 main.js 文件中import Vue from 'vue'let VueCom = Vue.extend();Vue.prototype.vc = new VueCom;这样就注册好了一个用于兄弟组件之间传值的中间件传值时：// 需要进行传值操作的事件transmit
2022-02-28 11:36:48
427
原创 原生JS实现上传图片预览效果
使用原生js完成预览上传的图片，并添加一定的判断。可选择将图片转换成base位然后再上传。预览input上传的图片文件
2022-02-23 17:18:32
853
原创 JS实现点击按钮copy内容
一：如果你想复制的是 input 或 textarea 里的内容<textarea id="input_copy">页面上展示的内容</textarea><button>点我复制内容</button><script> copyHref() { let copyInp = document.getElementById('input_copy'); copyInp.select();
2022-02-21 19:52:33
1645
空空如也
Vue3中的shallowReactive监听问题
2022-08-23
TA创建的收藏夹 TA关注的收藏夹
TA关注的人