- 博客(272)
- 收藏
- 关注
原创 用axios封装一个直接通过url地址请求的方法
请注意,上述代码中的 method 和 data 参数是可选的,你可以根据需要自定义请求方法和请求数据。此外,你可能还需要处理错误和异常情况,以确保请求的可靠性。你可以将上述代码保存为一个单独的文件,例如 api.js。然后在你的项目中导入并使用该方法来发送请求。你可以使用 Axios 来封装一个直接通过 URL 地址请求的方法。
2024-06-03 17:21:45 348
原创 vue封装一个查询URL参数方法
在上述示例中,getQueryParam 方法接受一个参数 param,它表示要查询的参数名称。然后,它使用 URLSearchParams 对象来解析当前 URL 的查询参数,并返回指定参数的值。请注意,上述代码中的 paramName 是要查询的参数名称,你需要将其替换为实际的参数名称。此外,你可以在其他组件中重复使用该方法来获取不同的 URL 参数。然后在你的 Vue 组件中导入并使用该方法来获取 URL 参数。在 Vue 中,你可以封装一个查询 URL 参数的方法来获取 URL 中的查询参数。
2024-06-03 17:19:17 387
原创 封装一个页面自适应方法
在上述示例中,getPageSize 方法返回一个对象,包含了页面的宽度、高度、宽高比、以及是否为移动端、平板端或桌面端的标识。你可以根据这些信息在组件中动态调整页面的布局和样式。你可以将上述代码保存为一个单独的文件,例如 utils.js。然后在你的 Vue 组件中导入并使用该方法来获取页面的自适应信息。在 Vue 中,你可以封装一个页面自适应的方法来根据屏幕大小动态调整页面的布局和样式。
2024-06-03 17:17:26 289
原创 vue封装url验证方法
在上述示例中,validateUrl 方法接受一个 URL 参数,并使用正则表达式来验证 URL 的格式是否有效。你可以在组件中调用该方法来验证用户输入的 URL。请注意,上述代码中的正则表达式是一个简单的示例,可能不能完全涵盖所有的 URL 格式。你可以根据需要调整正则表达式的规则。你可以将上述代码保存为一个单独的文件,例如 utils.js。然后在你的 Vue 组件中导入并使用该方法来验证 URL。在 Vue 中,你可以封装一个 URL 验证的方法来验证给定的 URL 是否有效。
2024-06-03 17:08:19 342
原创 vue限制日期选择器不能选今年后的日期
在上述示例中,我们通过 JavaScript 的 Date 对象来获取当前日期,并计算出限制日期选择器不能选择今年后的日期的最小日期和最大日期。请注意,上述代码中的日期选择器使用的是 Vuetify 的 v-date-picker 组件,如果你使用的是其他日期选择器组件,可能需要根据组件的文档来设置相应的属性。在 Vue 中,你可以使用 v-date-picker 组件来创建一个日期选择器,并通过 min 和 max 属性来限制日期的选择范围。
2024-06-03 17:01:50 240
原创 js通过音频链接获取音频时长
当loaddmetadata事件被触发时,它会解析带有音频持续时间的Promise,如果有错误,它会用错误拒绝Promise。要在JavaScript中从音频链接获取音频文件的持续时间,您可以使用fetch API来检索音频文件,然后使用audio API来获取持续时间。与视频示例一样,Audio元素的duration属性以秒为单位,因此如果需要,您可能希望将其转换为更易于阅读的格式。
2024-05-13 11:08:15 699
原创 用vue封装一个页面可以拖动按钮
组件使用data函数来管理按钮的拖动状态和位置。handleMouseDown和handleTouchStart方法处理拖动操作的开始,handleMouseMove和handleTouchMove方法处理拖动操作期间按钮的移动。handleMouseUp和handleTouchEnd方法处理拖动操作的结束。这段代码定义了一个DraggableButton组件,该组件可用于在页面上创建可拖动按钮。该组件接受两个道具:x和y,它们指定按钮在页面上的初始位置,并在按钮被拖动时发出一个拖动事件。
2024-05-13 11:02:17 333
原创 js通过视频链接获取视频时长
这个函数用提供的URL创建一个新的Video元素,并在loadedmetadata事件被触发时解析一个带有视频持续时间的Promise。它还处理可能发生的任何错误。注意,Video元素的duration属性是以秒为单位的,因此如果需要,您可能希望将其转换为更易于阅读的格式。
2024-05-13 10:55:53 499
原创 js怎么判断视频链接是否能播放
这个函数用提供的URL创建一个新的Video元素,并根据视频是否可以播放来解析一个Promise。它监听canplaythrough事件来确定视频是否可播放,并监听error事件来处理可能发生的任何错误。
2024-05-13 10:51:55 519
原创 echarts环形图 legend文字过长显示...鼠标移动上展示全称
【代码】echarts环形图 legend文字过长显示...鼠标移动上展示全称。
2024-05-11 15:48:27 413
原创 js判断文件后缀是图片
/ 输出: false。// 输出: true。// 检查文件扩展名是否在常见图片扩展名列表中。// 常见的图片文件扩展名。// 获取文件的扩展名。
2024-04-18 14:53:51 850
原创 vue3指令重复点击只发送一次请求
vue3写法指令在main.js中在app上挂载该方法app.directive( 'preventReClick', { mounted: function (el, binding) { el.addEventListener('click', () => { const events = el.style.pointerEvents if (events
2022-05-29 02:56:05 871
原创 vue3 在setup中使用mapSate以及对mapState的封装
在setup中使用mapSateimport { mapState, useStore } from 'vuex'import { computed } from 'vue'export default { name: 'App', components: { }, setup() { const store = useStore() // 用法1 const sCounter = computed(() => store.state.counter)
2022-05-26 15:30:36 455
原创 vuex-state展示的mapSate辅助函数
import { mapState } from 'vuex// 其他计算属性, 从store中获取computed:{ //写法1 mapState(["counter", "name", "age", "height"]) // 这里的mapSate是返回的一个对象 //写法2 // 可以这样写, 就把对象里面的展开了 , 这是数组的写法 ...mapState(["counter", "name", "age", "height"]) // 写法3 // 还可以传入对象的形式, 传入
2022-05-26 14:46:58 153
原创 FormData表单的问题
1.首先创建一个formdata实例const data = new FormData()const list = { a: '1', b: '2', c: '3'}2.将list放入formdata表单Object.keys(list).forEach(item => { data.append(item, list[item])})这就完成了formData的赋值了formData里面还可以放文件,想要打印文件可以这样:list[item].get('file')
2022-05-26 11:16:05 245
转载 css设置背景颜色渐变
对角线渐变:background: linear-gradient(to top right, #f6f5f0, #fefefd);如果有多个颜色渐变,颜色的参数可以有多个:background: linear-gradient(to top right, #CDDC39, #8BC34A, #FFEB3B);可以指定颜色渐变的位置:background: linear-gradient(to top right, #CDDC39 0%, #8BC34A 25%, #FFEB3B 100%);
2022-05-16 11:18:10 34280
原创 计算一天之内的时间差
const getkssj = (val) => { list.kssj = val form.zqsc = getHour(list.kssj, list.jssj) } const getjssj = (val) => { list.jssj = val form.zqsc = getHour(list.kssj, list.jssj) } // 计算时间间隔方法 const getHour = (s1.
2022-05-13 09:40:27 275
原创 input文件上传
<div class="uploadexcel"> <label for="fileInput"> <span class="importBtn">导入</span> <!-- <el-button type="primary">上传文件</el-button> --> </label> <input .
2022-04-22 16:45:16 923
原创 vue3笔记1
两个数组遍历取出相同的vue 动态添加样式的方式一、<li v-for="(chatting,index) in item" :key="index" :class="{'user_right':chatting.user_id}">判断chatting中是否有user_id,如果有就追加user_right类名二、<p :class="coms===1?'hear1':'hear'"></p>判断coms是否等于1,如果等于就追加hear1类名否则追加
2022-04-09 11:23:01 197
原创 js查找字符串中出现了三次的字符
let str = 'abvfFiioipuipplljlnnyfsaa' let arr = str.split('') console.log('111',arr); arr = arr.sort() console.log('222',arr); let temp = [] for(var i=0;i<arr.length;i++){ let sum = 0 for(var j=0;j<arr.length;j
2022-02-15 13:52:13 941
原创 js中entries(),keys(),values() , some(), Object.assign()遍历数组用法
js中entries(),keys(),values() , some(), Object.assign()遍历数组用法ES6提供了entries(),keys(),values()方法返回数组的遍历器,对于遍历器(Iterator)可以使用for…of进行便利,也可是使用entries()返回的遍历器Iterator.next()方法进行遍历。1.使用keys()遍历。keys()返回的是数组元素索引号的遍历器。const arr1 = ['a', 'b', 'c', 'd', 'e', 'f',
2022-01-14 15:49:11 892
原创 百度地图案例-修改地图样式
https://lbsyun.baidu.com/apiconsole/custommap这个网址里面点击 特色服务平台 - 个性化地图 - 地图模板 - 选择地图样式 - 点击发布样式 - 复制id到代码里面<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport
2021-12-09 15:32:06 1130
原创 百度地图案例-缩放组件、地图比例组件
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title&
2021-12-09 15:27:02 487
原创 百度地图3D旋转和倾斜角度的调整
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title&
2021-12-09 12:48:26 5439
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人