- 博客(112)
- 收藏
- 关注
RSS订阅原创 vant van-cell 配置value
本文展示了一个Vue3组件实现工位选择功能的代码片段。通过<van-cell>组件触发openActionSheet方法打开底部弹窗，使用<van-action-sheet>展示预设的工位列表（useStation数组）。当用户选择某个工位后，会更新选中的工位值(value)和显示文本(name)到数据模型中，并关闭弹窗。该实现采用了Vant UI组件库，通过响应式数据(ref)管理状态，完成了从展示到选择的完整交互流程。
2025-11-13 17:47:02
94
原创 Echarts 类型太多浮窗显示被遮挡问题
这是一个可视化图表的配置对象，主要用于展示"不健康原因总体趋势"。图表采用了白色文字和深色背景的对比设计，支持点击触发悬浮提示框（tooltip），并带有十字准线指示器。配置包含了标题、图例、坐标轴样式设置，以及数据系列的定义。tooltip具有动态定位功能，会根据点击位置自动调整显示位置，并设置了最大高度和滚动条。图表整体布局采用网格系统，确保标签显示完整，适合展示时间序列的趋势数据。
2025-10-30 10:57:33
87
原创 vue3 cron转换，
摘要：本文介绍了如何解析和预处理Cron表达式，并将其转换为中文描述的方法。代码通过规范化表达式、映射星期和月份名称、处理特殊字符、验证字段范围等步骤，最终生成可读的中文定时任务描述。核心功能包括表达式预处理、字段解析以及中文转换，适用于需要将定时任务配置本地化的应用场景。
2025-10-30 10:49:06
94
原创 uni-app video 多个视频循环播放 全屏自动播放 退出自动暂停功能
<view class="video_item"> <video v-for="(item,index) in video_url" :key="index" :id="'myVideo'+index" :src="item.name" @fullscreenchange="fullscreenchange" @play="saveplay(index)" class="classvideo" @click="videoPlay(index)"
2022-05-09 14:00:38
5196
3
原创 uView 2.x三级联动
<u-picker keyName="name" :show="show" @cancel="show=false" ref="uPicker" class="uPicker" :columns="columns" @confirm="confirm" @change="changeHandler" :defaultIndex="defaultarr"> </u-picker>import sheng from "@/static/c
2022-04-11 14:30:11
2740
7
原创 uView 2.x表单自定义校验失效问题
首先 官网基础的格式是两层的例如第一步需要注意的。model1: { userInfo: { name: '', phone: '', address:"", detailedddress:"" }, },想要自定义校验需要一层 userInfo: { name: '', phone: '', address:"", detailedddress:"" },第二步<u--form labelPosition=
2022-04-06 10:32:54
5234
2
原创 uni-app uview 微信小程序获取不到ref
当新下载运行的时候照着官网 uview 走，但是获取不到 dom的ref 有可能的因为微信小程序新下载的 详情----本地设置—调试基础库版本过低导致。修改成最高的即可。
2022-04-06 09:17:52
3813
4
原创 vue3.0Watch reactive
监听对象类型watch(numObj, (newValue, oldValue) => { console.log("numObj变化了", newValue, oldValue);});监听对象中的一个基本类型属性watch( () => numObj.a, (newValue, oldValue) => { console.log("numObj变化了", newValue, oldValue); });监听对象中的一些基本类型属性watch(
2022-02-11 11:37:37
347
原创 vue 3.0 ref Watch
// 监听一个ref定义的数据watch(num, (newValue, oldValue) => { console.log("num增加了", newValue, oldValue);},{ immediate: true, deep: true });// 监听多个ref定义的数据watch([num, num1], (newValue, oldValue) => { console.log("num增加了", newValue, oldValue);});...
2022-02-11 11:34:30
577
原创 vue3.0 Computed
计算 ref 定义的响应式数据const fullName = computed({ get() { return firstName.value + "-" + lastName.value; }, set(value) { const arr = value.split("-"); firstName.value = arr[0]; lastName.value = arr[1]; },});计算 定义的响应式数据person.fullName
2022-02-11 11:32:24
305
原创 vue3.0父子组件传参
export default { props: ["mess"], //需要props声明才能在setup收到参数 setup(props) { console.log(props.mess); },};export default { emits: ["xd"], //需要emits声明才能在setup中使用 setup(props, context) { function clickMe() { context.emit("xd", "子组件的值
2022-02-11 11:15:35
778
原创 vue 设计深拷贝
// 标准的深拷贝 =>引用数据类型(数组，对象) function deepClone(source){// [] m> Array(基类){} =>Objectconst targetobj= source.constructor =m= Array ? [] : {}; for(let keys in source){ if(source.hasOwnProperty(keys)){ // keys => 3 // 引用数据类型 if(s
2022-02-07 10:11:17
401
原创 前端防抖与节流
一、防抖<input placeholder="请输入电话"<script>// 防抖 =>将多次操作变成一次let telInput =document.querySelector('input')telInput.addEventListener('input', antiShake(demo, 2000))//防抖封装function antiShake(fn,wait){let timeOut = null; return args => {if(ti
2022-02-07 09:16:46
433
原创 vue canvas 连线带箭头
首先 左边的线连接右边的线的话 都要准确找到双方的位置所以我们通过getBoundingClientRect（）方法去寻找例：this.$refs[`${item.refs}`][0].getBoundingClientRect().left例：this.$refs[`${item.refs}`][0].getBoundingClientRect().top但是呢 如果你的canvas在屏幕的任意位置 直接用上面获取的话是不行的。获取的位置不是以canvas为基准获取的而是以屏幕的宽高。所以↓.
2021-12-23 16:02:43
4406
1
原创 vue 饿了吗文本域禁止拉伸
::v-deep .el-textarea .el-textarea__inner{ // 然后找到对应的类名，在这里将拉伸去掉即可 resize: none; height: 80px; }
2021-11-16 15:00:49
609
原创 vue+QT数据的细节处理
问题一、QT传过来的数据的时候 他可能在字符串里会有 /n的，不是QT开发人员自己写的是他的程序自动生成的，导致在调用我们vue方法的时候根本就没有走进方法里面去。所有首先让Qt的开发人员去处理一下/n换号的问题。问题二、当这个方法里走进来的时候 其实数据还会有问题，当有汉子的时候会有一个“/”的问题。但是我们得需要俩两个“//”，所以接收的时候那个参数用到了汉子 我们就让Qt人员把数据通过base-64加密一下数据。当数据传到vue的时候我们在反解析一下再去做处理。问题三，当我们再去做处理的时候，会
2021-11-09 10:31:19
2148
原创 vue与QT交互篇
首先兄弟要先引用一个文件！咱把他取名叫“qwebchannel.js”/******************************************************************************** Copyright (C) 2016 The Qt Company Ltd.** Copyright (C) 2014 Klarälvdalens Datakonsult AB, a KDAB Group company, info@kdab.com, author
2021-11-09 09:21:08
5815
9
原创 node 上传图片的基本方式
安装命令 npm i multer地址：https://www.npmjs.com/package/multer//utils文件const crypto = require("crypto")const multer = require('multer')const fs = require('fs')const path = require('path')function md5(s){ //注意参数需要为string类型，否则会报错 return crypto.cr
2021-10-26 11:52:18
307
原创 node连接mySql数据库
config.jslet dbOptiondbOption = { connectionLimit: 10, host: 'localhost', user: 'root', password: '123456', port: '3306', database: 'abc_blog'}module.exports = dbOptionindex.jsconst mysql = require('mysql')const dbOption = require('./c
2021-10-13 13:44:16
129
原创 node express解决跨域问题
输入命令 ：npm install cors --save在app.js中const cors = require('cors');app.use(cors());
2021-10-13 13:41:22
148
原创 React 装饰器操作
命令 npm install --save-dev @babel/plugin-proposaldecorators//config-overrides.js 文件const { override,fixBabelImports,addBabelPlugins} = require('customize-cra');module.exports = override( fixBabelImports('import', { libraryName: 'antd',
2021-09-07 16:01:11
266
原创 vue echarts 线形 line x轴年月日时间换行问题
options:{ title: { // text: '考试次数34次' text: '考试次数0次' }, tooltip: { trigger: 'axis', formatter: function (datas) { .
2021-08-25 09:08:33
1476
原创 vue echarts 条形 bar 基本需求归纳
1.要求y轴坐标要月份。2.浮窗要显示年与月3.要求x轴坐标要显示的是时间考虑的问题：1、首先所需要的数据都是从这个图里拿的，如果拿数据的时候只拿月份浮窗就不会显示年份。2、x轴的时间后台是反的秒，自己要通过秒来计算时间的多少展示在x轴上3、当自己处理定义浮窗内容的时候对应前面的颜色图标将会消失import ECharts from 'vue-echarts'import 'echarts/lib/chart/bar' //条形组件Vue.component('v-chart', ECh.
2021-08-25 09:00:10
836
原创 vue echarts 饼形 pie 基本需求情况
<v-chart class="radar-chart" :options="options"></v-chart>return{ options : { title: { text: `试卷分类占比`, left: 'left' }, tooltip: { t
2021-08-25 08:35:53
549
原创 vue list 数组参数交换位置
let data = [1,2,3,4]let number = 2 //这个是从哪开始移动位置let index = data.findIndex((e)=>e.id==number)if(index==0){ Main.myAlert('对不起,已经是第一位置了'); return }var tempOption = data[index - 1]this.$set(data, index - 1, data[index])this.$set(data, inde
2021-08-05 15:03:08
896
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人