- 博客(66)
- 收藏
- 关注
原创 vue+element ui实现表单组件的封装
效果图:主要是使用vue + elmentUi 的from的基础上进行封装使用改组件,是需要自定义从父组件传入一下字段表单字段${${然后先初始化表单字段的数据这些字段都是存在在一个新ts文件中,如果对象有值,根据不用的表单类型进行赋值回显,没有的话就是空。
2024-04-01 13:49:49 333
原创 解决vue2+elementUI的下拉框出现自动校验的问题
因为多选的是数组,所以要判断数组的长度是否大于0,才赋值,否者就是undefined。这种是只有值存在的时候才会给他赋值,但是这只解决单选下拉框,多选下来框还是会。item.key是要清除校验的字段名。是表单ref的formRef。还有一种方法就是一进入页面单独将会出现校验的字段手动清除,总结原因是因为新增的时候,传了空值进去。
2024-03-13 09:26:05 764
原创 公司项目总结合分享经验
value是代表要显示的值,success为true代表excel表格的内容填写是正确的,false代表的填写有无,然后完整的信息在depts里面(注意: 不同的字段的完整信息的字段名不一样,有的是输入框就不会有改字段)保存是将数据整理好,有的是父子任务的,有些字段要放在外面,要将这些父任务的字段房子一个集合中,和有一些父任务只有一个的,父任务的字段修改了其他的都要修改,这也要放在一个集合,保存在渲染到表格中。list是代表数据的数量,titleMap是代表数据中会有那些字段。最后点击送办理或者送立项。
2024-03-07 16:02:39 310
原创 前端实现标题滚动点击导航
要给父盒子去一个名称content_wrapper,然后在每一个标题盒子要roll_box类名。isScrollNows是导航栏绑定的值。点击导航栏滚动滚动条滚动到相应的位置。在mounted中要监听页面滚动。
2024-02-05 15:41:33 510
原创 前端实现搜索框筛选
里面还做文本操作隐藏,鼠标移上显示全部,方法在我之前的文章有介绍。是一个input输入框和一个button按钮组成输入框查询。treeDatas是页面返回来的数据。
2024-02-05 15:24:44 752
原创 element ui表格手写拖动排序
重点在于:拖动行到某一位置,拿到这一位置的标识,数据插入进这个位置 vueuse的拖拽hooks useDraggable 可以用;拖动到每一行上时拿到行标识,并动态插入交换表格数据,vue通过 diff算法分析,dom变动实现拖动效果。在 template 模版中 定义mousedown方法,表示开始拖拽,并拿到记录拖拽元素标识信息。可以做到拖动一个就掉接口,我这里是拖动完,点保存才将数据传给后台。放置时拿到拖动行id ,目标行 id 请求数据,动态刷新表格数据。在created里面定义拖动方法。
2024-02-05 14:50:28 1596
原创 在指定页面浏览器窗口发生变化监听并刷新页面
要使用inject来获取app中定义的刷新页面的方法。使用provide,inject。在离开这个文件的时候删除事件。
2023-12-26 10:25:19 776
原创 css-tricks网站图例
使用css实现钟表<template> <div> <p><small>CSS sin() and cos() does <strong>NOT</strong> work in your browser.</small></p> <div class="clock"> <div id="app" class="clock-face"> &
2023-11-28 10:38:26 330
原创 解决vant列表刷新,接口调用多次
onLoading默认为false,为false,才会调用接口,开始调接口将onLoading改为true,等到执行完再改为false// 请求数据列表})
2023-11-23 16:58:24 367
原创 【无标题】文本超过一行隐藏,鼠标经过显示提示框
/ 文本宽度 > 实际内容宽度 =》内容溢出。// 文本容器宽度(父节点)// tooltip的可控。// 控制提示框是否可用。在使用的地方引入就可以了。// 文字出现的位置。// 文本的实际宽度。
2023-11-23 11:43:16 92
原创 Vue2使用dhtmlx-gantt插件实现复杂甘特图
<template> <div class="container"> <div ref="gantt" class="gantt-container" /> </div></template><script>import { gantt} from 'dhtmlx-gantt'import 'dhtmlx-gantt/codebase/dhtmlxgantt.css'export default {
2023-11-10 11:04:09 7330 6
原创 elementui时间日期组件右边自定义图标
然后是将右边的图标设置为display:none,设置宽度,左右内边距。首先是将左边的清除图标关闭。
2023-10-26 15:14:00 939
原创 css样式
130 其实就是 header和footer的高度;注意:在浏览器中,100vh的高度包括了底部的工具栏,而我们真实需要的高度其实是浏览器的可视高度也就是100%;2,使用flex弹性布局,将footer的margin-top设置为auto。在使用100vh的时候,手机浏览器底部的操作栏可能会遮挡底部按钮;3.通过css内置函数calc()动态计算内容的高度。所以这时页面的高度应该使用100%在内容设置flex: 1。按钮模块就会放置在底部。
2023-05-15 11:52:38 273
原创 vue3的学习
/ 学习数据的组装 const test =() => {id : '1' , name : '动物' , pid : '0' } , {id : '2' , name : '鸟类' , pid : '0' } , {id : '3' , name : '无脊椎动物' , pid : '4' } , {
2023-01-31 18:58:26 157
原创 async与await的应用
在复用和新增的操作的时候,需要拿接口返回来的id才能进入改信息的详情页,但是有时候接口返回的太慢,拿了上一条的id。要拿到接口返回来的id,就是通过调用列表数据的接口,拿到他最新的第一条数据的id,进行调用详情的接口。上面的代码,async放在then后面,然后await要等列表接口调用完,才执行下面的操作。await 相当于 Promise 的 then ,then指的是成功,不指失败。执行 async 函数,返回的是 Promsie 对象。2.它只是同步语法,即用同步的写法写异步的代码。
2023-01-30 14:21:33 238
原创 Object.defineProperty的使用
Object.defineProperty 需要三个参数(object , propName , descriptor)3 descriptor 属性描述 => 加的这个属性有什么样的特性【类型:Object】2 propName 属性名 => 要加的属性的名字 【类型:String】如果没设置writable值的时候就默认只读,属性是无法覆盖。当enumerable设置为true就可以枚举到的属性。只有设置writable为true,才可以修改。1 object 对象 => 给谁加。
2022-10-20 22:11:51 397
原创 js得到目的的多种写法
原生的JavaScript没有contains方法。“运算符执行操作这样的二进制表达式,但他们返回标准的JavaScript的数值.”他们将-1转换为0,而0在JavaScript中又是false。
2022-10-17 10:51:10 144
原创 源码学习分享
可以缓存变量,下次再调用的时候可以从缓存中读取,如果存在缓存就使用缓存,如果不存在就重新计算下。* 高阶函数cached函数,输入参数为函数,返回值为函数。// function()就是指fn这个方法,function里面的str就是指str。// 首先通过Object.create创建一个干净的空对象出来。// 因为结果都是一样的,所以第五使用了第四次的结果,用缓存的值。// 因为上面三次执行结果都是不一样的,所以要重新计算,// 如果缓存中符合就返回缓存的,没有的则重新计算。
2022-10-12 17:34:58 195
原创 学习后盾人的javascript
new Date()可以通过 *1,来将其装换成时间戳,而Date()不能。new Date()返回的是一个对象,date()返回的是一个字符串。
2022-09-20 21:57:08 160
原创 javascript基础
调用函数来进行转化的,Boolean() toString() String() Number()、parseInt() 和 parseFloat() 来实现。如果表达式运算符为-、*、/、%中的任意一个,此时 JavaScript 会自动将字符串转换成数字,对无法转换为数字的则转换为 NaN。运算符为>或
2022-09-14 22:09:52 174
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人