- 博客(266)
- 资源 (23)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 vue2+openlayers6 项目实战示例详解【目录】
Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动OpenLayers是一个JavaScript 类库包，主要是用于开发Web GIS客户端。这就是说，要先在网页中引用OpenLayers的JavaScript文件以及相应的css样式表和资源，根据其提供的功能接口，直接调用。
2023-09-15 11:34:25
2741
1
转载 uni-app 微信小程序根据角色动态的更改底部tabbar
文章目录1. 需求背景1.1 源码下载2. 问题前提及思路3. 开始撸3.1 设置 `tabbar.js` 配置不同角色不同的菜单3.2 设置 `page.json`3.3 vue 配置3.4 tabBar组件代码3.5 setRole方法1. 需求背景公司要求开发一个小程序，要求二种不同权限的人群都可以使用，使用时根据不同的权限，获取不同的tabbar，以及展示对应不同的内容。登录页面分为 用户登录 及 管理员登录1.2 用户登录和管理员登录的 tabbar 根据账号角色进行对应展示1.1
2020-10-14 15:44:48
99156
140
原创 H5实现第三方分享功能，(WhatsApp,Facebook,Messenger,Instagram,Telegram,Zalo,Twitter/X)
【代码】H5实现第三方分享功能，(WhatsApp,Facebook,Messenger,Instagram,Telegram,Zalo,Twitter/X)
2024-06-25 15:17:23
473
原创 解决vite打包只生成了一个css和js文件问题
这样肯定是不行的，因为这样这个文件的包大小很大，第一次访问会。今天整了一个项目，试了下打包，发下打包后只生成了。我看了我的页面路由代码，果然是这样引入的。原因是因为这种写法是路由懒加载（已经根据页面分js和css了。
2024-05-23 15:04:04
620
1
原创 vue3 ts问题 找不到模块“@/views/home/index.vue”或其相应的类型声明。
今天帮同事看了一个问题，他尝试用vite+vue3+ts+pinia创建项目，结果刚上来就遇到这么一个问题。
2024-05-22 16:42:32
918
原创 vue3 使用css实现一个弧形选中角标样式
在前端开发中，ui同学经常会设计这样的样式，用于区分选中的状态下面抽空简单些了一下，记录下，后面直接复制用。
2024-05-22 11:05:55
1415
原创 vue3 使用unplugin-auto-import自动导入模块
模块化已经是现代 Web 开发必不可少的开发方式，频繁引入依赖包是一个常见的操作。但是，手动引入依赖包往往繁琐，尤其是当依赖包数量较多时，会显著降低开发效率。插件，可以帮助我们在项目中，自动导入常用的使用的第三方库的 API，就可以方便我们开发，提升开发效率。如果项目中使用eslintrc校验则需在vite.config.ts中的AutoImport添加配置。配置完成，运行项目会在根目录生成auto-import.d.ts文件。
2024-05-15 11:04:16
394
原创 js 函数节流和函数防抖及区别详解
浏览器中总是有一些操作非常耗费性能。所以就有了函数节流和函数防抖来提高浏览器性能。函数节流：频繁触发一个事件时候，每隔一段时间，函数只会执行一次。函数防抖：当触发一个时间后的n秒内，如果该事件没有被第二次触发，则执行。否，则重新开始计时。不论是函数防抖还是函数节流，都是性能优化的一种手段，都是为阻止函数无意义的执行，减小dom压力，避免不必要的性能浪费。以上是封装好的防抖，节流函数。大家可自取。
2024-04-20 20:33:25
474
原创 ajax轮询 websocket SEE 实现实时消息推送与优缺点详解
在很久很久以前，前端一般使用轮询来进行服务端向客户端进行消息的伪推送，为什么说轮询是伪推送？因为轮询本质上还是通过客户端向服务端发起一个单项传输的请求，服务端对这个请求做出响应而已。通过不断的请求来实现服务端向客户端推送数据的错觉。并不是服务端主动向客户端推送数据。显然，轮询一定是上述三个方法里最下策的决定。首先轮询需要不断的发起请求，每一个请求都需要经过http建立连接的流程（比如三次握手，四次挥手），是没有必要的消耗。客户端需要从页面被打开的那一刻开始就一直处理请求。
2024-04-20 20:12:58
996
原创 js事件循环机制（event loop）宏任务 微任务详解
用简单的流程解释事件循环。在了解什么是事件循环之前我们需要先行了解 javascript是一个单线程语言 和 javascript的事件分类。
2024-04-20 11:25:31
754
原创 js try catch用法详解 异常处理 异步捕获
这2段代码try，catch都不会捕获到错误信息，因为promise内部的错误不会冒泡出来，而是被 promise 吃掉了，只有通过。catch 包裹了计划要执行的函数，该函数有延迟，这时js引擎已经离开了 try…为了捕获到计划的函数中的异常，那么 try…能工作，代码必须是可执行的。块中的语句执行完毕，或者没有发生任何错误try块中的语句执行完毕，最后将执行。块中的语句首先被执行。try语句包含了由一个或者多个语句组成的try块，和至少一个。块中语句，其中括号中的err参数被作为例外变量传递。
2024-04-19 17:51:04
2277
原创 vue3 van-list van-pull-refresh实现上拉加载，下拉刷新
用于展示长列表，当列表即将滚动到底部时，会触发事件并加载更多列表项。用该组件可实现上拉加载。两个变量控制加载状态，当组件滚动到底部时，会触发 load 事件并将。事件，在事件的回调函数中可以进行同步或异步操作，操作完成后将。此时可以发起异步操作并更新数据，数据更新完毕后，将。若数据已全部加载完毕，则直接将。// 如果返回数据为空，表示已加载完成。
2024-04-12 17:35:46
1938
原创 vue3 Pinia详解使用详解
通过创建数据仓库vuex 中的 state 在 pinia 中可以引用ref和reactive创建响应式数据vuex 中的getters在 pinia 中可以引用computed创建计算属性vuex 中的mutations和actions在 pinia 中就是普通函数, 同步异步都可以。
2024-04-11 15:01:39
1240
原创 vue结合纯CSS实现蛇形流程图/步骤条
** 偶数行旋转箭头，步骤倒序排列（使用transform交换位置） */隐藏多余的箭头（如果container设置了overflow。// 给每行最后一个步骤（除最后一行）添加向下的连接箭头。/** 可配置的参数 可以调整试试 */
2024-04-11 10:10:05
1451
1
原创 CSS3 实现文本与图片横向无限滚动动画
文章目录1. 实现效果2.html结构3. css代码1. 实现效果gif录屏比较卡，实际很湿滑，因为是css动画实现的2.html结构<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>
2024-04-03 14:42:14
1636
原创 使用nvm管理nodejs版本
这个是每个全能前端经常会用到的，之前用过现在重装了，又要去看博客安装，索性自己总结下记录下来，方便以后更快捷开发nvm是一个node版本管理工具，通过它可以安装多种node版本并且可以快速、简单的切换node版本。
2024-03-29 16:43:27
823
原创 css的active事件在手机端不生效的解决方法
需求：需求就是实现点击图中的 “抽奖” 按钮，实现一个按钮Q弹的放大缩小动画。上面是实现的效果，pc端，点击触发。问题：但是这种方式在模拟器上可以，解决方案：在页面body添加一个。，下面是简单的demo代码。
2024-03-22 20:09:53
606
原创 css3 实现html样式蛇形布局
文章目录1. 实现效果2. 实现代码1. 实现效果2. 实现代码<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>蛇形布局</title> <style> html, body { height: 100%; display: flex; flex-direction: column; align-i
2024-03-15 16:08:56
1397
原创 vue3 使用实现签到活动demo静态布局详解
虽然这个功能看上去比较简单，但是着仅仅是一个简单的demo，还要很多细节处理判断，比如当天已签到时，展示已签到图标当天未签到时，金币添加光圈旋转并且左右晃动动画签到天数为8天时候，进去后默认横向滚动到第8天动画实现。
2024-03-01 11:25:31
1198
1
原创 react 使用react-seamless-scroll实现无缝滚动
项目地址拉下来跑起来效果（gif录屏有点卡，实际很丝滑）可以支持多种无缝滚动方案，如向下滚动向左滚动滚动速度鼠标悬停单布停顿单行停顿时间数组属性更新数组添加数据图表滚动等react-seamless-scroll 无缝滚动有两种实现方式，一种是，另外一种是。
2024-02-03 10:38:23
1335
原创 uni-app 微信小程序之红包雨活动
/ 处理红包点击事件，可以增加分数或显示提示等操作。// 或者：this.showTip = true;// 例如：this.score += 1;// 可以根据实际需求自行添加逻辑。// 更新红包位置，约 60 帧。GIF录屏有点卡，实际比较丝滑。// 每秒创建一个红包。// 4秒后移除红包。// 点击后移除红包。
2024-01-26 16:50:10
2258
4
原创 vue结合el-table实现表格小计总计需求（summary-method）
/ 调用后端接口table数据。// 调用后端接口返回的总计数据。
2024-01-17 09:44:37
2202
原创 vue结合el-table实现表格行拖拽排序（基于sortablejs）
/ 需要在odEnd方法中处理原始eltable数据，使原始数据与显示数据保持顺序一致。// 略去数据，与前段代码一直。
2023-12-28 11:03:32
2157
1
原创 vue通过CSS实现手机充电效果
文章目录1. 实现效果2. index.vue 页面3. VabCharge.vue 组件代码1. 实现效果2. index.vue 页面<template> <div class="home"> <div class="body"> <vab-charge :end-val="endVal" :start-val="startVal" /> </div> </div></templa
2023-12-08 10:04:35
690
原创 uni-app 微信小程序之好看的ui登录页面（四）
文章目录1. 页面效果2. 页面样式代码1. 页面效果2. 页面样式代码<!-- 简洁登录页面 --><template> <view class="login-bg"> <br /><br /><br /><br /><br /><br /><br /> <view class="t-login"> <form class="cl">
2023-12-07 14:32:14
3418
1
原创 uni-app 微信小程序之好看的ui登录页面（三）
文章目录1. 页面效果2. 页面样式代码1. 页面效果2. 页面样式代码<!-- 简洁登录页面 --><template> <view class="login-bg"> <image class="img-a" src="https://zhoukaiwen.com/img/loginImg/bg1.png"></image> <view class="t-login"> <view class="t-
2023-12-07 14:31:52
5031
原创 uni-app 微信小程序之好看的ui登录页面（二）
文章目录1. 页面效果2. 页面样式代码1. 页面效果2. 页面样式代码<!-- 蓝色登录页面2 --><template> <view style="height:100vh;background: #fff;"> <view class="img-a"> <view class="t-b"> 您好， <br /> 欢迎使用，XXX小程序 </view> </v
2023-12-07 14:30:24
5014
4
原创 uni-app 微信小程序之好看的ui登录页面（一）
文章目录1. 页面效果2. 页面样式代码1. 页面效果2. 页面样式代码<!-- 蓝色简洁登录页面 --><template> <view class="t-login"> <!-- 页面装饰图片 --> <image class="img-a" src="https://zhoukaiwen.com/img/loginImg/2.png"></image> <image class="img-b" src
2023-12-07 14:30:07
7053
原创 uni-app 微信小程序之加载行政区图
*样式的width和height一定要与定义的cWidth和cHeight相对应*///正常这里给2就行，如果pixelRatio=3性能会降低一点。"网络错误，小程序端请检查合法域名"//替换为你组件的组件行政区域。
2023-12-06 09:35:27
996
原创 uni-app 微信小程序之整合colorui
uni-app版本支持多端，兼容性经过近上万使用者测试、反馈、改进，目前已非常稳定！说白了，就是uni-app版本的，只是uni-app版本更适合使用colorui。
2023-12-04 10:18:42
384
原创 uni-app 微信小程序之自定义navigationBar顶部导航栏
文章目录1. 实现效果2. App.vue3. pages.json 配置自定义4. 顶部导航栏 使用微信小程序自定义 navigationBar 顶部导航栏，兼容适配所有机型1. 实现效果2. App.vue在App.vue 中，设置获取的 StatusBar，CustomBar 高度（实现适配高度写法）uni.getSystemInfo 获取可视区域的高度wx.getMenuButtonBoundingClientRect() 胶囊按钮位置信息<script> im
2023-12-03 21:17:08
3727
1
原创 uni-app 微信小程序之自定义中间圆形tabbar
首先在pages.json文件中，新建一个tabbar页面"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages"style": {"navigationBarTitleText": "tabbar页面",},.....// 其他页面],tabbar页面代码此页面主要是写tabbar的html样式和布局，引用主页面代码，通过v-if控制进行展示主页面indexsearchmaimnews。
2023-12-02 00:47:31
1692
1
源码uni-app 微信小程序根据角色动态的更改底部tabbar
2022-03-24
Export2Excel和Blob的js文件.rar
2020-08-07
SM4Util.js 【前端JS sm4加密解密工具类】
2020-07-14
echarts 省级地图联动下钻(放在服务器下访问).zip
2020-03-31
echarts大屏设计图（7680-3240）分辨率.rar
2020-01-03
JQuery颜色渐变插件jquery.color.js
2018-12-10
JFreeChart生成图表数据所需的Jar包
2018-05-31
Echart报表实现的Demo案例
2018-05-31
vm10keygen注册机秘钥获取
2018-01-25
Java生成条形码所需的barcode4j-light.jar包
2018-01-13
MyBatis逆向工程代码
2017-12-15
包含jstl-api-1.2.1.jar，jstl-1.2.jar，jstl-impl-1.2.jar，standard-1.1.2.jar
2017-08-29
24套java项目源码及视频教学
2017-07-21
Java实现物流跟踪查询+Demo+Word
2017-07-07
tomcat7官方版apache-tomcat-7.0 正版
2017-06-19
淘淘商城Spring注入报错求大神帮看看啊！！！跪求，看了好久了没解决
2018-01-16
TA创建的收藏夹 TA关注的收藏夹
TA关注的人