- 博客(40)
- 收藏
- 关注
原创 vue3通过html2canvas dom转图片复制到剪贴板和dom转图片并下载
【代码】vue3通过html2canvas dom转图片复制到剪贴板和dom转图片并下载。
2024-07-22 16:32:03
412
原创 springboot程序文件上传集成腾讯云cos
创建cos存储桶(访问权限需要设置为共有读私有写,这样到时上传的文件才可以通过链接访问)创建cos对象存储访问密钥拿到secretId和secretKey。上传超过后可以在存储桶中看到自己上传的文件。前提:有腾讯云服务器并开通cos对象存储。在项目中添加腾讯云cos坐标。
2024-03-30 16:17:29
539
原创 springboot3中token的颁发及使用拦截器实现请求前的token拦截校验
【代码】springboot3中token的颁发及使用拦截器实现请求前的token拦截校验。
2024-03-03 22:51:36
1020
1
原创 element-plus中el-autocomplete组件选择数据后提示框反复弹出解决方案
element-plus el-autocomplete
2023-03-09 15:00:51
1478
原创 微信小程序通过lottie库实现json动画
在页面wxml文件创建一个canvas标签来存放动画(注意这里canvas需要包裹在view标签中并设置 style="width: 100%;把ui提供的json文件动画改成js文件并通过module.exports导出文件。json动画模糊问题处理(需要把像素比率计算进去,完美解决)在页面ts文件中使用动画。
2023-02-04 15:41:33
2325
原创 内联样式和js中使用calc方法
:style="height:calc(100vh - ${bannerHeight}px)"div.style.height = "calc(100vh - " + (this.bannerHeight + 69) + “px)”;
2022-02-21 18:54:47
1902
1
原创 css权重,权值与优先级解析
1. 权重概念:权重,是一个相对的概念,代表了选择器之间的相对重要程度。 2. 权值概念:权值又叫权重系数,是根据选择器之间权重大小而得到的量化的值。 3. css优先级:css样式的优先级是由其权值决定的,权值越高其css优先级越高,但这里有个例特殊点,!important的权值可看做无限大4.权值计算第一等级:代表 内联样式,如 style="",权值为 1,0,0,0;第二等级:代表 ID选择器,如 #id="", 权值为 0,1,0,0;第三等级:代表 calss | 伪类
2021-11-08 20:25:36
2735
原创 vue中数据劫持代理
1.vue中的数据劫持代理指的是开发者调用或修改组件data里的某个属性时可以直接使用this.属性名,而不用写成this.data.属性名2.实现原理主要就是用到了Object.defineProperty()方法,具体实现代码如下<script type="text/javascript"> //模拟组件data let data = { userName :'玄猫', year:18 } //模拟组件实例 let _this = {
2021-09-29 16:15:58
384
原创 eventBus实现vue兄弟组件通讯
eventBus原理是创建一个空Vue实例, 然后在上面挂载通讯事件, 在响应事件时, 可以认为这个Vue实例(组件), 是所有组件的父组件, 在触发事件时, 可以认为这个Vue实例, 是所有组件的子组件. 实现兄弟组件通讯一共分以下四步1.创建eventBus.js的代码来实现一个空的Vue实例.import Vue from “vue”;let bus = new Vue();export default bus;2.在触发事件和响应事件的兄弟组件上都导入eventBus.js,把触发事件和响
2021-09-01 20:54:34
277
原创 通过sync修饰符实现vue父子组件间双向绑定
vue父子组件间实现双向绑定的方法在vue中是不允许子组件直接修改父组件传过来的变量的值,官方推荐子组件向父组件发射一个$emit方法,再在父组件接收的子组件传过来的方法中去修改父组件传给子组件的值,这样比较麻烦,也不方便与其他同事之间的协同开发,这里介绍一种简单的方法来实现父子组件双向绑定,即通过sync修饰符实现双向绑定1.父组件给子组件传值时添加。sync修饰符2.子组件修改父组件传过来的值时在方法前添加 update:...
2021-07-20 16:09:11
271
原创 vuex的单一状态树概念
vuex的单一状态数概念vuex中单一状态数概念其实很好理解,就是在一个Vue项目中只能有一个store,这样做得好处是单一状态树能够让我们最直接的方式找到某个状态的片段,而且在之后的维护和调试过程中,也可以非常方便的管理和维护,如果你的状态信息保存在多个store对象中,那么之后的管理和维护等都会变得特别困难...
2021-07-01 15:32:12
352
原创 高阶函数filter,map,ruduce的用法介绍
1.filter,对象筛选函数如图,筛选age值为5的对象组成新数组结果打印2.map,对象属性修改函数把data数组中的所有对象的height属性的值乘100打印结果3.reduce,对象属性累加函数把data数组中所有对象的age属性累加,这里的累加初始值为0,也可根据实际情况改变初始值结果打印...
2021-06-01 20:44:05
438
原创 input在移动端软键盘显示搜索按键的注意要点
input在移动端软键盘显示搜索按键的注意要点1.input需要被包裹在form表单中2.input的type类型为search3.点击按钮的触发事件为@keydown.enter="相应函数"4.form表单的action为action="javascript:return true;防止页面跳转...
2021-06-01 19:11:07
481
1
原创 v-model中修饰符lazy,number, trim的作用
1.v-model.lazy,修饰符lazy只有在按回车或者输入框失去聚焦后才更新数据绑定2.v-model.number,修饰符number,让返回值的类型为number类型而不是string类型3.v-model.trim,修饰符trim,可以去除用户在输入时在输入框前后添加的空格代码js部分...
2021-03-26 22:36:50
721
原创 vuecli3中vuex的安装和基本使用
1.在项目中使用npm命令npm install vuex --save安装vuex插件2.在src文件夹下创建一个store文件夹,在store文件夹里建一个index.js文件,这里我们的文件夹不叫vuex而叫store是因为我们使用vuex主要是使用vuex的store方法3.在index.js中第一步导入vuex,第二步在vue对象上安装vuex插件,第三步创建vuex.Store(Store首字母要大写)对象,第四步导出store让其他组件可以使用4.在vuex.Store里面设置sta
2021-03-21 20:42:36
1975
3
原创 几种路由导航守卫的作用
1.两种全局导航守卫beforeEach是在路由跳转之前调用,afterEach是在路由跳转之后调用,全局守卫只要路由跳转就会调用2.路由独享守卫路由独享守卫其实就是路由里面的导航守卫,只有跳转到对应的路由里面才会触发3.组件内的守卫想要了解具体的内容大家也可以去官网查看,里面有详细注解...
2021-03-20 20:28:58
1792
原创 js中的深浅拷贝
基本数据类型保存在栈内存,引用类型保存在堆内存中。根本原因在于保存在栈内存的必须是大小固定的数据,引用类型的大小不固定,只能保存在堆内存中,但是可以把它的地址写在栈内存中以供我们访问。浅拷贝指的就是仅拷贝对象的地址,这样会使被拷贝的对象会因为拷贝的对象的数据改变而改变如上图,b拷贝a就是浅拷贝,b拷贝的仅是a的地址,当b改变时其实就是堆里面的数据改变了,因为a的地址指向的也是这个堆,所以a的内容也改变了深拷贝是指拷贝一个对象的数据之前先给拷贝的对象创建一个堆地址,这样当拷贝的对象指向的堆中的数据
2021-03-17 20:45:52
161
原创 layui使用详解
layui使用详解layui是一种很好用的前端模块化ui框架,里面有各种已经封装好的ui插件,开发者只要下载layui的代码引入到自己的项目中就可以直接在自己的里使用layui的前端ui插件,下面我用日期和时间组件的例子来教大家使用layui1.1:下载layui的js和css的引入代码,大家可以去layui的官网下载,官网地址为https://www.layui.com/,进入官网是这个页面1.2进入官网后直接点立即下载就好了,下载的是zip格式的压缩包,我下载后是放在桌面的,然后直接在桌面解压一
2021-03-10 21:43:29
2796
3
原创 vue脚手架中<keep-alive>的作用
标题vue脚手架中的作用<keep-alive>是vue内置的一个组件,可以使被包含的组件保留状态,或避免从新渲染可能这么听有点抽象,那我举个例子吧一般渲染组件我们会用<router-view>标签假设我们有个Home组件,我们直接用<router-view>标签当页面路由来回跳转到Home组件时,Home组件会被反复创建和销毁,我们可以在Home组件里调用created()生命周期函数,因为我的vue用的是3.0版本不推荐使用的destroyed和beforeD
2021-03-07 15:34:45
285
原创 vue脚手架3中<router-link>的常用属性
<router-link>的常用属性<router-link>是路由对象里面已经封装好的一个组件, 支持用户在具有路由功能中的点击导航。1.to属性:可以通过to属性指定目标地址2.replace属性:不需要接属性值,当你点击不同的组件时默认是通过history.pushState方式来路由跳转,history.pushState方式可以点浏览器的返回来返回到上一个页面地址,类似栈中数据的存取方式,当我们添加了replace属性后会通过history.replaceStat
2021-03-04 21:19:01
3185
3
原创 vue2和vue3中vue-router从默认模式切换为history模式
1.vue-router从默认模式切换为history模式为什么要切换vue-router的默认模式location为history模式呢?这是因为默认的location模式的url里面localhost:8080后面会接一个/*而history模式下的url里面localhost:8080后面则没有/*,更加美观和更加符合url的规则解释完为什么vue-router中要切换history模式后下面教我的方法吧第一步:更换router文件夹下的index.js文件里的默认导入的函数create
2021-03-03 22:42:42
2583
1
原创 vue-router的基本使用
vue-router的基本使用第一步:在组件文件夹下创建一个Home.vue组件第二步:在router文件夹下的index.js文件中导入Home组件原因是你想配置组件的路由映射关系肯定要让路由里面有这个组件第三步:在index.js文件的routes中配至路由和组件的映射关系第四步:在app.vue文件中使用路由(通过router-link标签和router-view标签)router-link:该标签是vue-router中内置的一个组件,它会被渲染成一个a标签router-vi
2021-03-03 20:54:40
239
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人