- 博客(37)
- 收藏
- 关注
RSS订阅原创 block-size解决水平垂直方向同一元素宽高互换问题
根据元素的书写模式定义了元素块的横向或纵向尺寸。根据 writing-mode 的值，此属性对应于 width 或 height 属性。若为纵向书写模式，则 block-size 的值对应于元素的宽度；否则对应于元素的高度。
2023-11-08 16:38:35
123
原创 create-react-app 创建一个react项目中配置使用less
create-react-app 创建一个react项目中配置使用less
2023-08-25 15:43:21
202
原创 vue中实现拖动调整左右两侧div的宽度，解决iframe内嵌页面操作的卡顿问题
vue中实现拖动调整左右两侧div的宽度，解决iframe内嵌页面操作的卡顿问题
2022-10-19 16:43:01
1094
原创 textarea高度自适应
textarea高度自适应得以实现。代码如下：HTML:<div id="message-textarea"> <pre><span></span><br></pre> <textarea></textarea></div>CSS:#message-textarea{ max-height: 50px; outline: 1px solid #000; positi
2021-10-12 13:47:07
380
原创 js键盘按钮keyCode及示例大全
组合键if ((window.event.ctrlKey)&&(window.event.keyCode==49))alert("您按下了CTRL＋1键");从以上例子可以看出，shift、Control、Alt 在JS中也可用“window.event.shiftKey”、“window.event.ctrlKey”、“window.event.altKey” 代替。Internet Explorer/Chrome 浏览器使用 event.keyCode 取回被按下的字符，而 N
2021-08-19 16:43:04
365
原创 Microsoft Edge安装扩展插件
1、打开Microsoft Edge浏览器2、右上角找到“…”符号点击在弹出框中选择“扩展”按钮点击跳转至扩展页面，点击左侧“获取Microsoft Edge扩展”找到需要安装的插件，点击获取启动，可以在导航栏应用插件...
2021-06-01 15:02:49
3432
原创 页面跳转后elementUI的table组件样式不加载，需要再次刷新页面
页面跳转后elementUI的table组件样式不加载，需要再次刷新页面将跳转前后的页面中的style 中加上scoped<styel scoped>...<style>
2021-05-25 18:28:03
1037
原创 鼠标悬浮到div改变样式
1）.div{ cursor:default }默认正常鼠标指针2）.div{ cursor:hand }和.div{ cursor:text } 文本选择效果3）.div{ cursor:move } 移动选择效果4）.div{ cursor:pointer } 手指形状 链接选择效果5）.div{ cursor:url(url图片地址) }设置对象为图片...
2021-05-25 17:29:24
863
原创 vue+elementUI动态获取数据列表展示并分页
elementUI动态获取数据列表展示并分页HTML:<div style="width:100%;height:100%;margin-left:50px"> <tp-table :data="tableData" //接口获取的数据（分页后的数据） style="width:100%;padding:0 10px;overflow-y:auto;overflow-x:auto;" height="400">
2021-05-25 16:39:18
1816
原创 C#中应用Dictionary集合
C#中应用Dictionary集合Dictionary：指从一组键（key）到一组值的映射，每一个添加项都由一个值及相关联的键组成键是唯一的，不能为空引用（null），值可以是空值key和value可以是任何类型额（string、int等）应用：1、创建及初始化：IDictionary<string, string> myDictionary = new Dictionary<string, string>();2、添加元素myDictionary.Add("USE
2021-05-14 14:54:30
628
原创 npm常用命令大全
npm全称Node Package Manager ，随同NodeJS一起安装的包管理分发工具，方便下载、安装、上传、及管理包一、安装（一）基础语法1、安装：npm install XXX2、安装指定版本：npm install XXX@xxx3、本地安装：npm install XXX4、全局安装：npm install XXX -g安装包将信息保存到项目的package.json文件中（二）安装依赖1、-S, --save 安装包信息将加入到dependencies（生产阶段的依赖）
2021-04-24 16:08:32
1378
转载 在做一个评论模块的时候，想在评论的内容添加一些emoji表情，
在做一个评论模块的时候，想在评论的内容添加一些emoji表情，在网上搜了一堆之后，发现最适合的还是v-emoji-picker组件库。首先是下载该库npm install v-emoji-picker(我这边前端的依赖管理用的是npm)下载完成后，你可以选择在全局使用该组件，也可以在某个页面使用。话不多说，上效果图(可能视频转gif有点质量问题)因为这个组件没有设置是否显示和隐藏的属性，所以我们可以使用vue的指令v-show 来使这个组件是否显示出来<template> <d
2021-04-24 14:11:31
587
原创 移动端开发评论模块的时候添加一些emoji表情
在做一个评论模块的时候，首先做一个遮罩层，在点击评论是显示，想在评论的内容添加一些emoji表情，在网上搜了一堆之后，发现最适合的还是v-emoji-picker组件库。首先是下载该库npm install v-emoji-picker(我这边前端的依赖管理用的是npm)下载完成后，你可以选择在全局使用该组件，也可以在某个页面使用。因为这个组件没有设置是否显示和隐藏的属性，所以我们可以使用vue的指令v-show 来使这个组件是否显示出来 <div class="overlay-input
2021-04-24 14:07:32
493
1
原创 如何控制同步方法在异步方法后执行
如何控制同步方法在异步方法后执行在开发中，常遇到一种情况，同步方法需要应用异步方法返回数据，也就是要保证同步方法在异步方法后执行，这是就需要应用.then()，在异步操作完成时调用.then()方法，在.then(this.同步方法)getDataAsync({ url:, method:"get", data:null, sucCallbackFunc:function (retData, textSta
2021-04-15 16:12:41
871
原创 浏览器触发reflow（回流）的操作
浏览器触发reflow（回流）的操作1、字体大小改变（font size change）2、窗口大小改变（screen change）3、样式表添加或者删除（add/delete stylesheets）4、JS更改DOM元素（更改DOM颜色除外）5、hover动作（:hover颜色除外）6、位置计算（offset cats）7、用户输入（user input）8、改变样式属性（颜色，透明度等除外）...
2021-04-15 16:10:41
465
原创 window.location各方法应用和区别
window.location应用一、Reload()reload() 方法用于重新加载当前文档。 如果该方法没有规定参数，或者参数是 false，与用户单击浏览器的刷新按钮的效果是完全一样的。如果把该方法的参数设置为 true，绕过缓存，从服务器上重新下载。这与用户在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。二、replace()replace() 方法可用一个新文档取代当前文档。该方法不会在 History 对象中生成一个新的记录。当使用该方法时，新的 URL 将覆盖 His
2021-04-06 18:30:58
321
原创 实现点击页面其他部分隐藏指定div
实现点击其他部分隐藏某个div一、在点击展示的元素上设置@click.stop=""<div class="proTitle" @click.stop="showModel()" style="width:250px; overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display: flex;align-items: center;"> <span type="text" class="" id="na
2021-04-06 18:29:30
300
原创 JavaScript array对象常用方法总结
JavaScript array对象常用方法总结push() 方法可向数组的末尾添加一个或多个元素 1,2,3 -->1,2,3,4unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。1,2,3–>4,1,2,3reverse() 方法用于颠倒数组中元素的顺序。 1,2,3,4 -->4,3,2,1shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。 1,2,3,4 -->2,3,4slice() 方法可从已有的数
2021-04-02 11:36:15
181
原创 模糊查询：SQL语句中like应用
模糊查询：SQL语句中like应用一、% ：表示任意0个或多个字符，可匹配任意长度和类型的字符%% 匹配中文% 参数 % 模糊查询传参多个条件 and 连接eg: SELECT * FROM [user] WHERE u_name LIKE ‘%三%’ AND u_name LIKE ‘%猫%’二、_：任意单个字符，匹配单个任意字符，常用来限制表达式字符长度eg：SELECT * FROM [user] WHERE u_name LIKE ‘三’ 匹配三个字且中间是三的SELECT
2021-04-02 09:26:38
702
原创 vue的生命周期
vue的生命周期一、vue每个组件都是独立的，每个组件都有一个属于它的生命周期，从一个组件创建、数据初始化、挂载、更新、销毁，这就是一个组件所谓的生命周期。创建：beforeCreatecreated挂载：beforeMountmounted更新：beforeUpdateupdated销毁：beforeDestroydestroyed二、vue中内置的方法 属性和vue生命周期的运行顺序（methods、computed、data、watch、props)props => met
2021-04-01 18:16:04
69
原创 JSON.parse()和JSON.stringify()区别和应用
JSON.parse()和JSON.stringify()①.JSON.stringify是从一个对象中解析出字符串var a = {a:1,b:2}结果：JSON.stringify(a)"{"a":1,"b":2}"②.JSON.parse是从一个字符串中解析出json(键值对)注意：单引号写在{}外，每个属性名都必须用双引号，否则会抛出异常。var str ='{"name":"huangxiaojian","age":"23"}'结果：JSON.parse(str)O
2021-03-31 16:19:17
83
转载 滚动条样式设置
滚动条样式设置::-webkit-scrollbar 滚动条整体部分::-webkit-scrollbar-thumb 滚动条里面的小方块，能向上向下移动（或往左往右移动，取决于是垂直滚动条还是水平滚动条）::-webkit-scrollbar-track 滚动条的轨道（里面装有Thumb）::-webkit-scrollbar-button 滚动条的轨道的两端按钮，允许通过点击微调小方块的位置。::-webkit-scrollbar-track-piece 内层轨道，滚动条中间部分（除去）
2021-03-31 15:52:11
128
原创 深拷贝和浅拷贝
深拷贝和浅拷贝深拷贝：主要是将另一个对象的属性值拷贝过来之后，另一个对象的属性值并不受到影响，因为此时它自己在堆中开辟了自己的内存区域，不受外界干扰。浅拷贝：主要拷贝的是对象的引用值，当改变对象的值，另一个对象的值也会发生变化。深拷贝：json方法实现this.lastPageParam = JSON.parse(JSON.stringify(window._array))//深拷贝==> deepClone（window._array）{ let firstObj = J
2021-03-31 15:42:03
40
原创 localstorage本地存储数据实现最近浏览获取
localstorage本地存储数据实现最近浏览获取开发思路：一、存入在需要记录的地方调用setInLocalStorage方法方法中需要实现的需求：1、将localstorage中的数据取出2、判断存储中是否有数据，如果没有则将新的数据直接存入3、如果有进行判断，判断要存入的数据是否重复4、有重复删除之前存入的重复数据5、应用unshift将新的数据存在最顶部6、将数组存入localstorage中setInLocalStorage(nodeData){
2021-03-31 14:55:34
680
原创 搜索快速输入重复查询问题总结
搜索快速输入重复查询问题总结移动端开发在进行条件搜索，在进行快速输入条件是会发现搜索的数据有重复的现象，解决方法如下1、对onInput设置时间延迟$('.centerSearch').bind('input propertychange', function() { setTimeout(() =>{that.searchProcessContent() },300); });2、数组复制时，定义一个空数组，将接口获取的值push到空数组中，将
2021-03-31 14:48:41
183
原创 字母大小写转换（搜索信息是忽略大小写）
字母大小写转换（搜索信息是忽略大小写）具体情况：项目搜索功能是忽略字母大小写的，也就是搜索框输入abc 同样能搜索出ABC文件，但在数据展示时做了控制，也就是只有当数据名称中包含输入文字才可以展示，因此同样需要对字母大小写进行处理。封装转换大小写方法mutation(stringFirst, stringSecond) { var thizz = this var word = ""; for (var i = 0; i < stringSecond.length; i+
2021-03-31 14:41:06
321
原创 面包屑横向滚动条动态加载数据默认显示最右侧数据
面包屑横向滚动条动态加载数据默认显示最右侧数据在移动端项目开发中，文件浏览层级面包屑展示，为提高项目易用性，提出需求：在面包屑长度大于父级div长度是显示横向滚动效果，且默认展示最右侧数据这个问题我踩坑无数次，在浏览文件就我确定解决方案是将ele.scrollLeft = ele.scrollWidth;但是我尝试在页面初始化mounted中控制，发现滚动条长度增加时不会进行第二次初始化。我查阅资料部分文档在watch中监控滚动条的变化，从而进行赋值操作，无论怎么尝试，都不能解决问题。偶然翻阅到vue
2021-03-31 14:25:19
589
1
原创 搜索框输入文字查询数据，需要匹配文字高亮显示
移动端开发经常遇到在搜索框输入文字查询数据，为提高易用性，需要匹配文字高亮显示，一、不区分大小写brightenKeyword(val, keyword) { val = val + ''; if (val.indexOf(keyword) !== -1 && keyword !== '') { return val.replace(keyword, '<font color="#248adf">' + keyword + '
2021-03-31 14:08:51
1133
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人