- 博客(30)
- 资源 (1)
- 收藏
- 关注
原创 js RGB 转换为 HEX
项目中碰到需要将rgb 转换为hex,找到方法是将rgb 每个数字由10进制转换为16进制const rgbToHex = (r, g, b) => { const toHex = num => { const hex = num.toString(16); return hex.lenght === 1 ? `0${hex}` : hex; }; return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
2022-05-06 14:24:21
786
原创 linux 启用apache\mysql 环境
启用mysqlservice mysqld start // 该命令无法启用时根据错误提示直接取用,如下图/bin/systemctl start mysqld.service重启mysqlservice mysqld restart // 该命令无法启用时根据错误提示直接取用,如下图类似于启用mysql启用apacheservice httpd start // 该命令无法启用时根据错误提示直接取用,如下图类似于启用mysql...
2022-05-06 11:32:44
674
原创 vue model 使用
vue 组件封装中,使用model 配合.sync 修饰符实现联动实现子组件数据改变同步修改父组件chid.vue<template> <div> <el-button @click="showChange">button</el-button> <div v-show="show">{{ name }}</div> </div></template>&l
2022-03-30 11:52:07
1956
原创 js 常用函数
获取两个日期之间的天数格式可为yyyy-MM-dd | yyyy/MM/ddconst getDays = (date1, date2) => Math.abs(new Date(date1) - new Date(date2)) / (1000 * 3600 * 24)getDays('2020-04-04', '2021-03-25') // .log(355)获取当前时间const curTime = new Date().toTimeString().slice(0, 8.
2021-11-30 16:31:55
92
原创 vsCode 代码快速生成
选择你需要的快速得到的代码片段案例: vue.json如果需要在.vue 中需要输入某个特定代码可快速得到下面一段代码// 输入vue,得到以下代码片段<template> </template><script>export default { name: '', data() { return {} }, mounted() {}, methods: {}}</script&g.
2021-11-05 11:35:32
602
原创 html 图片加载优化
在项目开发中,如果页面中图片过多,就会出现页面加载缓慢的问题。优化的方案为图片降级<div class="box"> <img id='webp' alt=''> <img id='jpg' alt=''></div>/** * 首先考虑使用webp格式的图片,因为webp格式的图片拥有无损压缩和有损压缩两种模式而且压缩率更高等优点。 * 但是webp 但是改格式也有缺点ios|IE|webView是不支持的所以的进行判断。 .
2021-11-05 10:25:18
1449
原创 vue 封装滚动数字组件
该组件包含正整数及浮点型小数父组件引用<roll-number :font-size="16" :num="num"></roll-number><script> setInterval(() => { this.num = Math.random() * (10000 + 1); }, 3000);</script>rollNumber.vue 数字滚动组件html<template> <div
2021-07-22 15:04:29
387
原创 修改html 中图片地址
//正则获取图片地址: 1、'#src="(.*?)"#' ;2、 '/\s+src\s?\=\s?[\'|"]([^\'|"]*)/i' ;function imgSrc(htmlString, newSrc){ return htmlString.replace(/\s+src\s?\=\s?[\'|"]([^\'|"]*)/i, newSrc));
2021-07-21 11:58:45
471
原创 将浮点数点左边的数每三位添加一个逗号
浮点数点左边的数每三位添加一个逗号,12000000.11转化为『12,000,000.11』function commafy(num){ return num && num.toString().replace(/(\d)(?=(\d{3})+\.)/g, function($1, $2){ return $2 + ',' }; });
2021-07-21 11:51:53
296
原创 elementui table 文本限制行数隐藏
elementui table 中 show-overflow-tooltip=“true” 只能有一行隐藏有时候无法满足需求时html<el-table-column label=""> <template slot-scope="scope"> <el-tooltip popper-class="tip-cell" placement="top" v-model="sco
2021-07-21 11:24:24
2016
原创 vue 封装组件库,发布至npm
该文章引用:https://blog.youkuaiyun.com/qq_31851435/article/details/106647833封装vue组件库有2种形式:使用 webpack-simple 模板,没有vue-router的中间件,不需要路由时推荐使用,同时 webpack-simple没有格式的检测。使用 webpack 模板。┌─testNpm 项目主目录├─ src │ └─ components 存放所.
2021-04-14 14:59:25
389
原创 vue 响应式dom监听
vue 响应式dom监听CSS Element Queries基于vue 监听到dom 尺寸变化的组件 // 安装 npm install css-element-queries --save // 引用 // 1、全局引用 main.js import ResizeSensor from "css-element-queries/src/ResizeSensor"; import ElementQueries from 'css-element-queries/src/Elemen
2021-04-06 10:15:49
299
原创 js 加锁
js 加锁 防止重复提交$(document).ready(function(){ var lock =false;//锁作为全局变量 $("#submit").on('click',function(){ //如果用户提交了一次,lock被置为true,锁开启。后续在锁被关闭之前,用户都不能提交数据。 if(lock) { //锁已经开启,在提交只会被阻断 return false;
2021-03-10 11:28:04
2183
原创 css3 圆形轨迹动画
css3圆形轨迹动画<!doctype html><html lang="en"><head> <meta charset="UTF-8" /> <title> css3圆形轨迹动画 </title> <style type="text/css"> @keyframes animX{ 0% {left: 0px;} 100% {left:
2020-09-25 14:02:31
872
原创 js 禁止拖动
js 拖动时禁止页面的滚动//touchstart里document.documentElement.style.touchAction = 'none';//touchend里document.documentElement.style.touchAction = 'auto';
2020-09-25 13:59:46
1318
转载 <audio>在 iOS 微信端不能自动播放
在 iOS 微信端不能自动播放一般来说我们要利用 实现音频自动播放只需要在 标签上加上 autoplay 属性.实现简单的 音频自动播放,代码如下:<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="vi
2020-09-25 13:57:38
490
原创 正则简单封装
正则//获取图片地址: 1、'#src="(.*?)"#' ;2、 '/\s+src\s?\=\s?[\'|"]([^\'|"]*)/is' ;//手机号码验证function checkPhone(){ if(!(/^1[34578]\d{9}$/.test(phone))){ alert("手机号码有误,请重填"); return false; }}//精确小数点后两位var Price = '11.22';var reg = /^
2020-09-25 13:46:19
295
原创 css 隐藏滚动条或更改滚动条样式
css 隐藏滚动条或更改滚动条样式/*css主要部分的样式*//*定义滚动条宽高及背景,宽高分别对应横竖滚动条的尺寸*/ body::-webkit-scrollbar { width: 10px; /*对垂直流动条有效*/ height: 10px; /*对水平流动条有效*/ } /*定义滚动条的轨道颜色、内阴影及圆角*/ body::-webkit-scrollbar-track{ -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3)
2020-09-25 11:57:28
770
原创 input 的 placeholder 的字体样式
input 的 placeholder 的字体样式input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: red; } input::-moz-placeholder { /* Firefox 19+ */ color: red; } input:-ms-input-placeholder { /* IE 10+ */ color: red; } input:-moz-placeholder { /* Firefox 1
2020-09-25 11:55:31
177
原创 css 背景图 适应
css 背景图 适应CSS 属性指定可替换元素的内容应该如何适应到其使用的高度和宽度确定的框。 <div class="bg"> <img src="../../assets/images/headImg.jpg" alt=""> </div>.bg { background-color: seagreen; height: 200px; width: 100px;}img { height: 100%; wi
2020-09-25 11:53:09
326
原创 css 文字溢出省略号
css 文字溢出省略号单行.row { overflow: hidden; text-overflow:ellipsis; white-space: nowrap;}多行.rows{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; /*3行*/ overflow: hidden;}
2020-09-25 11:27:43
85
原创 git 指令
git 指令 git add . 添加文件到缓存 git status 查看状态 git commit -m 'remark' 提交至本地 -m 'remark' 提交的说明 git commit --no-verify -m "commit" 就可以跳过代码检查 git pull origin master 下载更新分支至本地 git push origin master 上传至远程 git merge origin/master
2020-09-25 11:23:10
127
1
原创 element ui tree 树形控件 数据重新赋值 默认选中
element ui tree 树形控件 数据重新赋值 默认选中需求:当对树形控件的数据进行重新赋值时,当前勾选及展开的状态需要保留。<template> <div> <el-tree ref="tree" :data="data" show-checkbox node-key="id" :default-expanded-keys
2020-09-25 10:59:52
4101
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人