- 博客(58)
- 收藏
- 关注
RSS订阅原创 CSS 图片放大
transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。为了更好地理解 transform 属性
2022-03-02 09:14:57
766
原创 自定义公共样式
基于 uni-app单位的公共样式。自用。/**************** 自定义内容 **********************/ .hide { display: none !important;}.scroll-view_H{ white-space: nowrap; width: 100%;}/**************** /自定义内容 **********************/ /**************** 颜色/背景色 **********
2021-09-08 22:08:04
757
转载 css3 sticky不生效
转载自：https://www.jianshu.com/p/b72f504121f5作者：这名字真不对著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。总结原因：1. top、bottom 的生效距离由最近一个overflow属性是hidden scroll auto或 overlay 的祖先元素决定。2. 父元素为overflow:hidden时，由于容器内无法滚动，所以实际上也无法生效。3.必须指定top、bottom、left、right4个..
2021-08-14 09:41:13
446
转载 解决uniapp手机浏览器视频封面不显示问题
转载于：https://www.jianshu.com/p/630832d0dd96作者：小凖链接：https://www.jianshu.com/p/630832d0dd96作者思路：视频加载好自动播放，自动播放后立即停止播放，页面停止，达到显示封面的效果。代码分析：<video id="myVideo" :autoplay="true" -- 自动播放，必需 :src="videoUrl" :controls="true" --.
2021-07-21 10:35:50
2706
1
转载 uniapp 地图Map组件
需求：在地图上标注用户当前位置，并显示位置信息。设计图：思路：uniapp 地图组件mapAPI地址：https://uniapp.dcloud.io/component/map注意官方的话，很重要：地图组件用于展示地图，而定位API只是获取坐标，请勿混淆两者。地图组件用于展示地图，而定位API只是获取坐标，请勿混淆两者。地图组件用于展示地图，而定位API只是获取坐标，请勿混淆两者。啥意思呢 ？就是地图组件只是负责展示地图，不负责获取坐标，要额外去获取坐标和地理位置。
2021-03-04 22:59:09
3586
1
原创 echart 柱形图点击选中设置颜色( 非setOption )
需求：1.柱形图数据过多时，可以滑动切换；2.点击柱子，有白色的选中效果；效果图：使用到的内容API链接：1. color:https://echarts.apache.org/zh/option.html#series-bar.itemStyle.color2.click:https://echarts.apache.org/zh/api.html#events.%E9%BC%A0%E6%A0%87%E4%BA%8B%E4%BB%B6.click3.dataZoo...
2021-01-19 22:43:40
2151
原创 ecahrt 动态设置容器高度
API文档：https://echarts.apache.org/zh/api.html#echartsInstance.resize需求：图例的数据从后端获取，不确定数量，高度写死后，过多的图例数据无法渲染；解决思路：渲染好后，重新改变图表尺寸代码：var myChart = echarts.init(document.getElementById('echart'));var option = {......}myChart.setOption(op...
2021-01-16 21:35:59
274
转载 less循环类
参考、转载地址：https://blog.csdn.net/weixin_42801311/article/details/108098258需求：遍历某个类10次代码：.loop( @index) when(@index <= 10 ) { .ml-@{index} { margin-left: @index * 1px; } .loop(@index + 1);}.loop(1);结果：.ml-1 { margin-left: 1px;}.m
2021-01-13 22:40:05
223
原创 多选框的简单思路
简单思路：点击的时候，判断这个点击的id是否 等于选中的id数组（selectedArr）里面的id，那再点击就是取消选中<!DOCTYPE html><html><head> <meta charset="UTF-8" /> <title>666Hello React!</title> <script src="https://cdn.bootcss.com/jquery/3.3.1/jquery..
2020-11-25 22:29:34
152
转载 解决less中calc无法正确计算的方法
转载：https://blog.csdn.net/panyox/article/details/79049931calc括号内容，放在 ~" " 中即可：width：calc(~"100% - 80px")
2020-11-20 16:01:43
258
转载 React项目如何使用绝对路径@
转载：https://www.jianshu.com/p/7d0c8683e9831. 找到 config目录下webpack.config.js文件配置2. alias 内容下增加'@': path.resolve('src'),3.重新启动项目4.在文件中使用绝对路径（@）5.成功；
2020-11-17 10:35:59
1943
转载 React 中的constructor方法
转载地址：https://blog.csdn.net/u012149906/article/details/102821641constructor是否有必要写？答：ES5的继承，实质是先创造子类的实例对象this，然后再将父类的方法添加到this上。 ES6的继承机制不同，实质是先创造父类的实例对象this，所以必须先调用super方法，然后再用自己的构造函数修改this。如果子类没有定义constructor方法，这个方法会被默认添加，也就是说，不管有没有显示定义，任何一个子类...
2020-11-01 11:06:53
835
转载 replace 正则表达式,N位小数点
$(function(){ //验证正则 //引用直接在input添加属性;比如正整数 zsyz="1"；2位小数点 xsdyz="1" $(document).on("keyup", 'input[zsyz=1]', function () { this.value = this.value.replace(/\D/g, '')//整数 }); //输
2020-07-26 12:12:56
2473
转载 Vue I18n 使用方法
官方地址：http://kazupon.github.io/vue-i18n/zh/started.html#javascript官方代码：HTML<div id="app"> <p> {{ $t("message.hello") }} </p></div>JavaScript（main.js）（到时候会使用一个language.js 文件把messsages独立出来）// 如果使用模块系统 (例如..
2020-07-26 11:54:09
352
转载 echarts 无数据时提示文字
需求：要求图表没有数据时，文字提示“暂无数据”思路：使用echarts的title做提示，通过有无数据，设置title的show属性为true / falseecharts 设置 title的API：https://echarts.apache.org/zh/option.html#title效果图：①没数据时显示文字“暂无数据”②有数据时：代码：// 这里判断后端有无值，设置是否显示titlelet showed = this.list...
2020-07-25 15:49:16
6604
2
转载 Vue.nextTick 的用法
官方API：https://cn.vuejs.org/v2/api/#Vue-nextTick在下次dom更新结束后执行的回调函数，获取更新后的dom；在下次dom更新结束后执行的回调函数，获取更新后的dom；在下次dom更新结束后执行的回调函数，获取更新后的dom；使用方法:this.$nextTick( () => {} )...
2020-07-25 15:22:05
141
转载 Vuex 笔记
官方学习链接：https://vuex.vuejs.org/zh/项目结构：https://vuex.vuejs.org/zh/guide/structure.html├── index.html├── main.js├── api│ └── ... # 抽取出API请求├── components│ ├── App.vue│ └── ...└── store ├── index.js # 我们组装模块并导出 store 的地方 .
2020-07-20 22:48:07
117
转载 vue 获取select的选中对象值
vue 官网：https://cn.vuejs.org/v2/guide/forms.html#%E9%80%89%E6%8B%A9%E6%A1%86思路：通过下标值来获取，指向的对象的值代码：<!DOCTYPE html><html><head> <title>获取数据</title> <meta charset="utf-8"> <script src="https://cdn...
2020-07-17 22:51:39
6889
原创 vue 步骤条 简单思路
参考 Ant Design Vue 步骤条思路，只输入一个步骤参数即可实现参考地址：https://www.antdv.com/components/steps-cn/思路：循环步骤数组，当输入的步骤是3，小于3的是绿色（通过），等于3是红色（停止）简约图：代码：<!DOCTYPE html><html><head> <title>测试</title> <link rel="stylesheet" ...
2020-07-01 22:51:29
2066
转载 神奇的一行代码功能
转载链接：https://blog.csdn.net/csdnnews/article/details/1069535291. 一行代码修改网页任意内容以前改网页内容，你可能直接修改源代码，但知道了下面这个命令，打开浏览器，在Console中输入：document.body.contentEditable = 'true';( 整个网页就像一个富文本编辑器，你可以对任何一块内容进行修改)4. 一行代码网站变黑白html { filter: greyscale(1) }( f.
2020-06-26 11:16:00
201
原创 js 字符串切割并返回字符串
需求：把字符串www.test.com/detail/44最后一个/后面的内容全部清除，并返回字符串www.test.com/detail思路：由于substr(start, length) 、substring(start, end)返回切割的目标字符串，不是整个字符串，所以使用replace()把目标字符串替换掉。代码：let str = "www.test.com/deta...
2020-04-19 17:52:16
741
转载 使用FormData对象发送文件
转载：https://segmentfault.com/a/1190000012327982?utm_source=tag-newestfunction uploadFile() { var formData = new FormData(); formData.append("upload", $("#FileInput")[0].files); ...
2020-03-22 22:56:49
232
原创 命名空间的管理员——单例模式
使用的场景：function getData(val) { ......}function setData() { getData(val) .....}function deleteData() {......}这样可能会导致的问题有2个，①页面中添加了很多变量；②容易使用相同方法名，导致方法被覆盖。所以这时候我们需要命名空间的管理员—...
2020-03-08 22:42:41
264
转载 Refused to load the image '<URL>' because it violates the following content security polity diretive
转载地址：https://www.cnblogs.com/xiaoxiaoluoye/p/6945044.html深入学习地址：https://www.cnblogs.com/Hwangzhiyoung/p/9146740.html控制台报错：Refused to load the image '<URL>' because it violates the follo...
2020-03-02 17:33:33
9053
1
转载 浏览器HTTP协议请求头信息
转载：https://blog.csdn.net/wangzhen_csdn/article/details/80776991--------------- General ---------------Request URL: 资源的请求地址Request Method: HTTP方法（ GET/POST/HEAD... ）Status Code: 相应状...
2020-03-02 16:30:50
920
原创 图片允许加载
index.html添加上：<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src * ;img-src *"&...
2020-02-20 17:38:11
226
转载 前端跨域
版权声明：本文为SegmentFault 思否博主 安静de沉淀 的原创文章，遵循 《署名-非商业性使用-禁止演绎 4.0 国际》许可协议，转载请附上原文出处链接及本声明。原文链接：https://segmentfault.com/a/1190000011145364?utm_source=tag-newest（侵权请联系删除，谢谢作者❤）所谓同源是指"协议+域名+...
2020-01-12 22:03:44
149
原创 js详细判断数据类型
思路：使用 Object.prototype.toString.call()。Object.prototype.toString.call(new Date()); // [object Date]Object.prototype.toString.call("1"); // [object String]Object.prototype.toString.call(1); // ...
2020-01-12 16:44:34
106
转载 jQuery支付密码框
参考：https://blog.csdn.net/ansheng02/article/details/84637356?tdsourcetag=s_pctim_aiomsg思路：①使用隐藏的input获取输入的密码内容，并根据输入内容判断密码的长度进而展示*的个数；②使用li展示样式；完善了原文章没有做密码长度限制为6位数及密码选中效果。<!DOCTYPE html...
2020-01-07 23:00:52
398
转载 Element-ui项目搭建
参考地址：https://www.cnblogs.com/chwen1014/p/11249493.html1.初始化项目vue init webpack projectName2.打开Element-ui官方网站，根据提示操作：npm i element-ui -S...
2020-01-06 11:20:59
168
转载 rem 计算方式
// 使用方法1px = 0.01rem; !function(e,t){function n(){var n=l.getBoundingClientRect().width;t=t||540,n>t&&(n=t);var i=100*n/e;r.innerHTML="html{font-size:"+i+"px;}"}var i,d=document,o=wind...
2019-12-06 15:01:28
572
原创 模拟请求分页参数
下面是请求的例子<!DOCTYPE html><html><head> <title>模拟请求分页参数</title> </head><body> <button class="js-page" data-type="pre" type="button">上100</but...
2019-12-02 23:35:25
293
1
原创 Bootstrap 4.3中文文档链接
https://v4.bootcss.com/docs/4.3/getting-started/introduction/
2019-11-17 16:25:30
704
原创 请求接口增加加载提示框
思路：请求接口的时候就把弹窗的HTML append 到body，延迟1.5s后还没有返回请求，则show出弹窗；请求成功后删除弹窗HTML并清除清除定时器.var timeObj; //定时器对象；function addModalHtml() { var modalHtml = '<div id="LoadModal" class="hide modal"&g...
2019-11-17 16:20:06
403
原创 css 常用命名
头：header尾：footer页面外围控制整体布局宽度：wrapper内容：container页面主体：main内容：content导航：nav子导航：subnav菜单：menu子菜单：submenu注册： register登陆：login侧栏：sidebar栏目：column左右中：left right center登录条：login...
2019-10-20 23:09:56
168
原创 css common.css
.overflow-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}.responsive-img { display: block; width: 100%; }.responsive-img-fit { display: block !importan...
2019-10-20 23:09:02
504
原创 jq 遍历导航对象实现三级导航
思路： 给每个层级加一个child属性，如果存在则是有下一个层级菜单。这样层级关系、修改很方便。<!DOCTYPE html><html><head> <title>test</title> </head><body> <div id="Nav"></div>...
2019-09-22 14:21:24
594
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人