笔记
onpine
这个作者很懒,什么都没留下…
展开
-
1rem、1em、1vh、1px各自代表的含义
rem页面所有使用rem单位的长度都是相对于根元素<html>元素的font-size大小。即1rem等于根元素元素的font-size大小。em子元素字体大小的em是相对于父元素字体大小。元素的width/height/padding/margin用em的话是相对于该元素的font-size。vh、vw全称是 Viewport Width 和 Viewport Height,视口的宽度和高度,1vh相当于 视口高度的 1%。pxpx像素(Pixel),相对长度单位。像素px原创 2021-05-03 11:48:12 · 3000 阅读 · 0 评论 -
双飞翼布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>双飞翼布局</转载 2021-05-03 11:29:28 · 127 阅读 · 0 评论 -
圣杯布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>圣杯布局</t原创 2021-05-03 11:28:46 · 139 阅读 · 0 评论 -
apply()、call()、bind()的区别
Function.prototype.apply()MDN:apply() 方法调用一个具有给定this值的函数,以及以一个数组(或类数组对象)的形式提供的参数。调用有指定this值和参数的函数,返回的是结果,这点与call相同与call()相比接收的参数是参数数组func.apply(thisArg, [argsArray])Function.prototype.call()MDN:call() 方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。调用有原创 2021-05-03 10:14:51 · 104 阅读 · 0 评论 -
JS 手写深拷贝
var oldObj = { name: '范德彪', age: '43', designation: ['水库浪子','彪记靓汤总经理','彪哥解梦馆'], relationship: { jiefu: '马大帅', girl: '桂英', }}function deepClone(obj) { if(typeof obj !== 'object' || obj == null){ return obj; } let result = unde原创 2021-05-02 20:26:30 · 267 阅读 · 0 评论 -
VSCode配置vue用户代码片段Snippets
1、在导航栏找到并点击文件>首选项>用户片段2、选择创建什么样的代码片段,以Vue为例3、可以自定义自己的代码片段了,在下面的示例中,当输入vue会提示body中的内容原创 2020-11-06 17:41:55 · 1462 阅读 · 0 评论 -
VueCLI使用VSCode开发结合ESLint与Vetur格式化代码
1、在使用VueCLI创建项目时选择ESLint校验2、VSCode安装Vetur和ESLint插件3、在setting.json中添加下面几行配置"editor.codeActionsOnSave": { "source.fixAll.eslint": true, },4、对Vetur进行配置,让其不对js代码格式化5、检查ESLint是否启用6、最后,我们可以在项目根目录下的.eslintrc.js中自定义eslint规则...原创 2020-11-06 13:57:04 · 378 阅读 · 0 评论 -
在微信小程序开发中使用 @antv/wx-f2可视化方案
关于微信小程序使用 npm 安装第三包1、首先我们需要npm安装@antv/wx-f2npm install @antv/wx-f2 --save --production2、在需要使用的页面或组件的json文件中,引入第三方组件{ "usingComponents": { "f2": "@antv/wx-f2" }}3、在wxml中使用组件<view class="container"> <f2 class="f2-chart" onIn原创 2020-11-01 12:17:21 · 2440 阅读 · 4 评论 -
CSS 文字两行显示,超出隐藏
// 两行显示,超出隐藏display: -webkit-box;overflow: hidden;-webkit-box-orient: vertical;-webkit-line-clamp: (2);原创 2020-10-27 19:14:34 · 2223 阅读 · 0 评论 -
简单的根据浏览器窗口宽度的响应式布局
// 当浏览器窗口宽度大于1000px且小于1200px时的布局样式@media screen (min-width: 1000px) and (max-width: 1200px) { #content { position: relative; width: 20%; background-color: #eeeeee; margin: 0; padding: 0; box-shadow: 0 0 10px 0 #333333; }}..原创 2020-10-20 20:36:34 · 510 阅读 · 0 评论 -
(VUE)JS判断滚动条滑动到底部加载更多数据,并防止事件多次触发
首先在mounted中添加滚动条scroll监视事件 mounted() { //监视scroll滚动条 window.addEventListener("scroll", this.isRefresh, true); },在isRefresh函数中,当第一次到达底部时我们将isRefreshBool变量变为false(禁止refresh()加载数据函数多次触发),当我们的refresh()函数中请求完成后再将isRefreshBool设为true(允许到达底部执行refr.原创 2020-10-20 09:26:35 · 2583 阅读 · 1 评论 -
CentOS 7 安装MySQL5.7 踩坑集合
[Warning] TIMESTAMP with implicit DEFAULT value is deprecated. Please use --explicit_defaults_for_timestamp server option (see documentation for more details).解决方案:在/etc/my.cnf的[mysqld]配置文件添加:explicit_defaults_for_timestamp=true/usr/local/mysql/bin/my.原创 2020-10-19 14:36:09 · 207 阅读 · 0 评论 -
Nodejs笔记 path模块
var path = require('path')//动态的获取路径var dirPath = __dirname //当前文件所处目录的绝对路径var filePath = __filename //当前文件的绝对路径var textPath = path.join(__dirname,'text.js') //text.js的绝对路径原创 2020-10-10 16:45:02 · 64 阅读 · 0 评论 -
JavaScript异步编程 Promise 笔记
var fs = require('fs')var p1 = new Promise(function (resolve, object) { fs.readFile('./a.txt', 'utf8', function (err, data) { if (err) { object("error") } resolve(data.toString()) })})var p2 = new Promise(fun原创 2020-10-08 21:15:34 · 55 阅读 · 0 评论 -
CSS组合器:“,“逗号,“ “空格,“>“大于号,“+“加号,“~“波浪号
选择器组 A,B匹配A或BA,B{ color:red;}后代选择器 A B匹配A的后代BA B{ color:red;}子选择器 A>B匹配A的一代子节点BA>B{ color:red;}相邻兄弟选择器 A+B匹配A的下一个紧邻的兄弟节点BA+B{ color:red;}通用兄弟选择器A之后的全部兄弟节点BA~B{ color:red;}...原创 2020-07-04 09:19:55 · 250 阅读 · 0 评论 -
Vue生命周期函数:实例生命周期钩子函数
生命周期 ?:从Vue实例的创建、运行、到销毁期间,伴随着各种各样的事件,这些事件统称为生命周期生命周期钩子?:是指生命周期事件主要的生命周期函数分类:创建期间的生命周期函数:beforeCreate :实例刚在内存中被创建出来,此时,还没有初始化data和methods属性created :实例已经在内存中创建完成 ,此时data和methods已经创建好,此时还没有开始编译模板,这里是最早可以操作data数据和调用methods函数的地方beforeMount :此时已经完成了原创 2020-05-28 10:26:06 · 303 阅读 · 0 评论 -
Vue.js自定义指令及其钩子函数
对普通 DOM 元素进行底层操作,会用到自定义指令,我们以输入框获取焦点为例:当页面加载时,输入框将获得焦// 注册一个全局自定义指令 `v-focus`// Vue.directive('指令名', {钩子函数} )Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() }})// 这里是Vue实例中注册一个局部指令 `v-focu原创 2020-05-27 18:30:37 · 971 阅读 · 0 评论 -
ES6中新增的字符串补全方法 padStart 和 padEnd
padStart 和 padEnd作用类似,都是当字符串字符串的长度不够时,用特定的字符填充字符串,是字符串长度达到指定的长度;区别在于padStart再字符串前端进行填充,二padEnd再字符串尾部填充padStart 和 padEnd都有两个参数:参数1:指定字符串长度参数2:当长度不足时,指定进行填充的字符例如:var string1 = "1";console.log( string.padStart(2,'0') );// 输出结果为 "01"console.log( st原创 2020-05-26 16:17:57 · 544 阅读 · 0 评论 -
Vue绑定内联样式:Style 绑定
对象语法:v-bind:style 的对象语法和CSS语法很像,但他其实是一个 JavaScript 对象<div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' ,line-height: '50px'}"></div>data: { activeColor: 'red', fontSize: 30}直接绑定到一个样式对象:<div v-bind:style="styleObj原创 2020-05-26 15:57:19 · 2889 阅读 · 0 评论 -
Vue.js关于绑定 HTML Class 类样式
给 v-bind:class 一个对象,以动态地切换 class:<div v-bind:class="{ active: isActive }"></div><!-- 在对象中传入更多字段来动态切换多个 class --><div v-bind:class="{ active: isActive, 'text-danger': hasError }"></div>这里类active是否生效取决于变量isActive值的真假当 is原创 2020-05-26 15:30:29 · 193 阅读 · 1 评论 -
Vue过滤器与Vue.Filter
当全局过滤器和局部过滤器重名时,会采用局部过滤器。原创 2020-05-26 14:57:25 · 134 阅读 · 0 评论 -
Vue 自定义按键修饰符与自定义按键修饰符别名
在监听键盘事件时,我们经常需要检查详细的按键。实现仅在按下相应按键时才触发鼠标或键盘事件的监听器。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符:<!-- 只有在 `key` 是 `Enter` 时调用 `vm.add()` --><input v-on:keyup.enter="add()">Vue提供了常用的按键码的别名:.enter.tab.delete (捕获“删除”和“退格”键).esc.space.up.down.left.righ原创 2020-05-26 11:27:17 · 578 阅读 · 0 评论 -
通过php存入MySQL8.0文件路径“/”消失问题
把 " \ " 换成 " \\\\ " ,例如 E:\work\space 换成 E:\\\\work\\\\space原创 2020-03-08 16:15:42 · 221 阅读 · 0 评论