- 博客(72)
- 收藏
- 关注
RSS订阅原创 node.js与express.js创建项目以及连接数据库
创建项目：myservice是自己起的项目名称安装依赖包有时候会超时，多次执行npm install就会安装完成npm start浏览器访问http://localhost:3000就会看到页面。
2024-01-31 14:26:39
803
原创 el-table/element-ui 表格实现行编辑
珊妹儿最近一直项目需求要用el-table实现行编辑，这个功能嘛，是我领导写的，我呢，拿出来给大家借鉴一下，如果你们有更好的建议，欢迎留言~实现思路：1.表格数据我们拿到后，每一行都加个变量作为判断是否是编辑状态；tableData.map((item) => { return { ...item, showEdit: false, //是否可编辑，默认加载完数据不是可编辑状态，获取焦点后才可编辑 disabled: true, /
2021-12-15 18:41:24
6852
原创 el-table/elementui 表格组件实现每一列的筛选（两种方法）
大家好呀，珊妹儿最近更新的有点慢了，是因为最近疏于学习，工作也是没接触到一些新的技术，但近期由于工作使用了el-table组件，需求又有个列的筛选，鉴于项目前期使用的jqGrid,大家都知道，这个插件想要实现列的筛选很容易，因为它自己封装好了，直接可以用，但是我们的新功能使用了vue，所以选择了el-table。大家应该都知道官网上的筛选，只提供了类似下拉框多选的筛选，如果这一列是日期的话，我们希望是筛选的时候选择的是日期呢，又或者是input框呢？下面看下图就明白了：text类...
2021-12-15 17:18:20
5659
3
原创 vue打包项目发现打包结果太大了，vuex太大了怎么办？？
问题：vue打包项目发现打包结果太大了，vuex太大了解决方案：按组件加载vuexfunction a(){ //因为a有install,所以这里不会被执行}//vue引入文件import,require.ensure//Vue.use(a),如果参数a有install属性就执行install,如果没有就执行a本身a.install = function(vue){ vue.mixin({ created:function(){ //
2021-06-03 14:05:27
712
原创 2021春季前端面试题总结
get和post的区别 Cookie和session的区别 网络状态码 TCP和UDP的区别 设计模式和使用场景 深拷贝，浅拷贝 防抖和截流 Js的继承 原型和原型链 文件上传会导致跨域问题吗？怎么解决跨域？ Es6中的Promise； export和import的区别 For和foreach的区别 网络请求头信息里Content-type有几种类型，有什么区别？ 箭头函数和普通函数的区别，箭头函数可以作为构造函数吗 Es6中的无限扩展 Es6的this指向 Es6中的数组
2021-03-31 09:49:53
179
2
原创 用户一段时间不操作关闭浏览器标签页
珊妹这就把代码奉上： var lastTime = new Date().getTime(); var currentTime = new Date().getTime(); var timeOut = 30 * 60 * 1000; //设置超时时间： 30分 $(function(){ /* 鼠标移动事件 */ $(document).mouseover(function(){ lastTime =
2021-01-07 09:59:41
399
原创 bootstrap在一个tab页调用另一个tab页的方法
在我们开发过程中使用bootstrap框架的时候，会经常使用bootstrap的标签页，如果我们在tab子页面中操作的数据，需要在父tab里改变状态到时候，并且不关闭当前子tab页，父tab页只是局部刷新，又不是window.location.reload();刷新整个页面，接下来的代码就可以解决这个问题：$(window.parent.document).contents().find("#tab_2017090410572012 ")[0].contentWindow.itemListTbale.d
2020-11-17 16:36:42
860
原创 bootstrap模态框中使用select2插件下拉框不显示的问题
珊妹儿今天又遇到个问题，就是使用bootstrap的模态框，上一个模态框还没关闭再次弹出一个模态框中使用了select2下拉选的功能，发现下拉框显示在两个模态框中间层了，也就是不显示在最上层，珊妹给它加了个z-index:999999999；还是不好使，千千万万没想到的是要配合display:block来使用，至于究竟是为何？珊妹儿也未可知！就是在style里添加如下代码：.select2-container--open{ z-index:9999999 !important;
2020-10-27 17:35:59
526
原创 slickgrid刷新表格第一列复选框还存在选中状态的问题
珊妹儿在使用slickgrid表格插件期间，发现我每次对表格操作后刷新表格，会把之前选中的行数据还显示选中状态，但其实获取表格选中数据已经是空的了，这里我们在刷新表格的代码位置加一条代码:$(".slick-cell input[type='checkbox']").click();grid.setSelectedRows([]); //取消选择如果只用第二行代码，就还会显示对勾，检查元素会发现此复选框还存在checked="checked"属性，所以这两行代码都加上就没问题了！困扰了已久的问题
2020-09-09 14:39:03
375
原创 gojs给线添加鼠标移上去显示内容的事件，类似title属性
珊妹儿随着需求在一点点的探索gojs的知识，学习到的知识点也会更新博客，希望能跟大家一起学习~效果展示：鼠标移到线上，显示线的text,而线上默认显示指定的长度，因为如果线的text过长，会影响整体效果哦代码献上：一、首先在linkTemplate中添加如下代码：然后定义这两个方法： function tooltipTextConverter(person){ var str = ""; str += person.lineN
2020-08-21 10:55:23
2510
10
原创 gojs拓扑图实现节点外围圆环按钮
实现效果：（并且鼠标移上去改变背景颜色)官方案例参考：https://gojs.net/latest/samples/radialAdornment.html珊妹儿这就给大家献上代码：一、首先引用文件：<script type="text/javascript" src="./js/jquery-1.12.4.min.js"></script><script type="text/javascript" src="./js/gojs/go.js">
2020-08-21 10:07:15
1202
原创 daterangepicker实现双日历的时间段选择
前端的插件真的是数不胜数哦~ 今天珊妹儿来给大家分享个双日历的时间段选择插件，那就是daterangepicker,平时我们日期选择用的都是datetimepicker，这是单日历的插件，下面给大家双日历的文件下载链接：https://www.daterangepicker.cn/#usage这里展示的是下载的地方：下载下来的目录是这样的：但是需要注意的是：我们用这个插件是在jquery的基础上，然后下载下来的文件里并没有jquery,所以这里我们自己可以去下载jquery.min.js..
2020-08-11 16:05:10
912
原创 jquery.orgcharts插件的使用
珊妹又来给大家推荐好物了，哈哈~首先官网资料：https://github.com/dabeng/OrgChart官网上下载的是vue的项目哦，但是demo目录下的样例可以直接双击在浏览器访问，但是直接下载下来的样例里面引用的js/css路径都不对，你想看哪个样例需要改下里面引用文件的路径，因为是vue项目里面用的js是一些依赖包，那么我们双击打开看的话就需要自己去找一些js文件，珊妹遇到的问题是导出pdf,所以只改了这个文件因为导出pdf，需要html2canvas和jspdf的支持，所以
2020-08-06 11:37:34
2511
1
原创 elementUI的tree树形控件，阻止节点点击触发展开收缩的方法
当我们的操作是这样的时候：当我们想要点击新增或是删除的时候，有子节点的节点会触发展开收缩的事件，那么我们就要阻止冒泡了，只需要加上expand-on-click-node="false"就可以如图：
2020-08-04 14:48:49
14714
9
原创 bootstrap模态框里的select2的搜索使用不了的问题
珊妹儿今天遇到一个奇怪的问题哈，就是使用bootstrap的模态框，里面使用了select2的下拉框功能，但是发现select2原本自带的搜索框不能聚焦，使用不了了，解决办法：我们把模态框标签里的tabindex="-1"属性去掉就好了！！！！...
2020-07-30 16:14:27
369
原创 input 输入时中英文逗号都转为英文逗号的方法
<input class="form-control" placeholder="请输入查询条件" style="height:30px; width: 150px;" onafterpaste="this.value=this.value.replace(/，/g,',')" onkeyup="this.value=this.value.replace(/，/g,',')">主要是在onafterpaste和onkeyup事件的限制...
2020-07-06 15:50:10
1903
原创 gojs-设置流动的连接线
gojs,是一款前端展示拓扑图的插件，它遵循自己的语法，因为他的功能丰富，官网上也可以看到许多例子，珊妹觉得不是一款很容易上手的前端插件，需要一点点挖掘它的功能，但每次发现它的新功能，对它的认可度都会+1.今天我们来设置他的流动的连接线：珊妹是拿官网里最简单的例子来学习的，因为多余的代码少，更能清楚的知道每段代码的意义；1.首先在myDiagram.linkTemplate的设置里添加代码：$(go.Shape,{isPanelMain:true,stroke:"lightgree...
2020-06-29 15:14:14
3211
9
原创 Js实现传入一个obj对象，返回get请求的参数格式
传入的参数为：varobj={"a":"1","b":"2"};实现方法： getparam(obj);functiongetparam(obj){vararr=Object.keys(obj);varstr="?";for(variinobj){str+=i;str+="=";...
2020-06-19 10:47:42
2303
原创 js实现导出csv文件
大家好！今天珊妹儿给大家分享一个前端js导出csv文件的功能，之前珊妹儿在做后端的时候，记得都是在后端开发的导出文件功能，这次第一次在前端来做导出功能，发现也挺容易的，那么接下来就来给大家盘一盘。。。首先文件先引入jquery.min.js文件，然后接下来的代码：<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewpo...
2020-06-12 09:46:36
1124
原创 自定义上传文件按钮-只显示一个按钮
这里class里的值用来自定义样式：<input type="button" value="上传" onclick="javascript:$('input[name=\'files\']').click();" class="btn-search">
2020-06-03 16:15:59
464
2
原创 Bootstrap3--日常练手--实现面板折叠里面嵌入表格
大家好~ 珊妹这不是转了前端吗，前端插件真是数不胜数呢，所以珊妹打算以后会在闲暇时间来利用常用的插件来写一些大家平时可能会用到的例子来供大家参考，代码一定不是最优的，但尽可能是可用的，所以有幸遇到大神，还望多多提点一二~下面我们来说今天的功能，利用bootstrap插件完成面板折叠嵌入表格：首先下载bootstrap，这都不用说了，珊妹这里下载的是bootstrap3版本，下载链接：https://v3.bootcss.com/大家还要下载个jquery.min.js文件，可以去官网下载；然
2020-05-29 10:15:17
969
原创 div等元素位置自适应屏幕大小
珊妹今天给大家分享的是前端最低级且实用的技术，大家不论是开发还是面试都会经常碰见的问题的解决办法：#.我们开发时候，如果创建个div,可能会想让它适应任何屏幕大小，因为我们访问时候的电脑或手机尺寸大小不一，本来在我们开发的机器上美观的很，有时候我们的网站就会变得错综复杂，一盘散沙，下面就来提供几种方法：1.获取屏幕窗口高度-其它元素高度:var h = $(window).height()-$("#header").outerHeight(true);$("#div").css("heig.
2020-05-28 09:52:08
5186
原创 slickgrid首列添加复选框
复选框：varcheckboxSelector1; //定义checkboxSelector1=newSlick.CheckboxSelectColumn({cssClass:"slick-cell-checkboxsel"});columns.splice(0,0,checkboxSelector1.getColumnDefinition()); //添加到首列grid.registerPlugin(checkboxSelector1); //注册复选框...
2020-05-20 10:24:29
499
原创 前端js实现打印功能
如果电脑没有连接打印机，则会导出包含内容的pdf文件，打印页面内指定内容：html页面：<button type="button" onclick="exportpdf();"> 打印</button><div id="test" class="row">Hello world!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!</div>javascript:ffunction exportpdf(para
2020-05-19 15:15:22
854
原创 qrcode生成二维码（批量）
qrcode.js真的很简单，所以今天废话不多说，上代码：页面引入js文件： <script type="text/javascript" src="/js/qrcode.js"></script> <script type="text/javascript" src="/js/jquery.min.js"></script>html:<div id="qrcode"></div>js:// 简单方...
2020-05-19 15:03:48
1569
原创 slickgrid服务端分页原生解决办法
大家好~ 最近珊妹因为工作需要，又学习了一个前端表格插件哦！那就是slickgrid,老实说，珊妹也是第一次听说这个插件呢，因为这个插件使用的人实在是太少了，能查到的资料也少之又少呢，那就自己研究呗~首先需要去官网下载他的组件包，https://github.com/6pac/SlickGrid/wiki我下载的2.4.22版本，也是目前最新的版本了，下载下来的example文件下都是它的一些示例，可以参考。。。但是呢，大家都知道网站的分页，我们一定要做服务端分页吧，不然数据多的时候，页面就要崩溃了
2020-05-16 10:39:24
259
原创 初学vxe-table日记
珊妹儿又在研究一前端组件了，名为vxe-table,一个基于 vue 的 PC 端表格组件，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、 扩展接口等...vxe-table使用场景： 1.需要实现不同单元格编辑组件（比如：输入框、下拉框、日期选择等…） 2....
2020-04-28 17:15:46
2601
4
原创 ace editor基本使用方法
去除中间的竖线：editor.renderer.setShowGutter(false);去除行号： editor.setShowPrintMargin(false);设置并获取内容：editor.setValue("the new text here");editor.session.setValue("the new text here"); // set v...
2020-04-28 17:05:32
2985
原创 ACE代码编辑器中自定义提示片段
上一篇我们说了自定义提示，也就是图中左侧的提示框内容，现在珊妹儿来说说自定义右侧的提示片段~我们拿ace中支持的sql语言为例：首先我们知道在ace-builds/src-noconflict/snippets文件夹下有个sql.js，这个文件就是定义代码片段内容的文件，具体代码如下：效果如图：...
2020-04-28 15:04:19
1769
1
原创 ace.js的代码高亮和自定义提示代码补全
哈喽！！！大家好，我是珊妹儿，首先要说的是疫情特殊期间，仍然奋斗在工作岗位上的程序员们，大家辛苦啦~~~珊妹儿现在是真正从后端程序媛转成了一名前端程序媛，最近新入职一家公司，岗位是前端开发，第一天就接到一个以前从没听过的前端技术，那就是ACE~,珊妹儿刚接触这个词汇的时候，真的是一脸懵，从来没听过呢-_-......老大给了我一些学习资料，让我研究一天然后写出个demo,在这一天珊妹儿看的源代...
2020-04-25 21:23:52
4302
15
原创 小程序第一次下拉刷新，之后下拉就不刷新了
小程序的坑继续踩，踩，踩。。。。。。。。。。。。。今天小程序测试过程中发现一个问题哈，就是真机调试时发现列表页下拉刷新的问题，第一次可以正常刷新，之后就不显示刷新loading...了，这是什么问题呢，就是在下拉刷新调用后台接口后，要再执行停止刷新，下次刷新才可以正常刷新，这个问题在开发工具上是没有问题的，只有真机调试能看出来，所以这就是个坑。珊妹儿最近天天加班到十点多，几乎没有了生活，只...
2019-08-30 22:39:26
735
2
原创 安装微信开发工具时提示无法写入d3dcompiler_47.dll文件
安装微信开发工具的时候提示无法写入d3dcompiler_47.dll文件的错误，怎么丢失的珊妹儿确实不知道，但是我们可以下载回来啊！可以通过微软官网搜索-》kb4019990-》然后选择这个然后继续：下载下来安装后再次安装微信开发工具就可以了！！！哈哈~ 珊妹儿最近又回归开发小程序了，微信小程序开发者们，以后大家多多交流哈~~~...
2019-08-21 09:27:21
5702
4
原创 vue 判断一个变量的值去显示另一个变量的样式el-table-column标签
如图，根据传过来的变量instructions是否有值，去对变量num的字体颜色操作
2019-08-08 18:39:24
2058
1
原创 vue项目在线上服务器访问失败原因
珊妹儿遇到一个奇葩问题哈，跟大家伙来分享分享，首先因为刚接手的项目，我还没有线上服务器的连接信息，前端代码都是我打包好给别人，别人传到服务器的，传到线上服务器访问不了，这就是中间出现了问题。 所谓，打包就是压缩的概念，而压缩文件再次压缩就会导致文件成倍的增大，这中间就出现了很多问题，我们排除了很多问题都没找见原因，后来我就寻思拿U盘拷一份再试试，结果成功了！！！！！据珊妹儿多年经验来...
2019-08-04 20:06:52
4152
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人