- 博客(28)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 在不使用js在情况下只用css实现瀑布流效果
使用到的是grid 布局，需要注意的是grid-template-rows: masonry; 目前只有Firefox 浏览器支持这个效果，而且还是一个实验性属性需要在设置里面开发实验性选项才行。
2024-06-13 16:52:54
641
原创 infer 条件类型中的类型推断
infer 关键字在条件类型中使用，用于从依赖于泛型参数的类型中推断（提取）泛型参数的类型。这允许您编写更灵活且可重用的类型定义。
2024-04-18 11:56:22
334
原创 【无标题】
在html文件中的head里面加上meta标签width=device-width：页面的宽度适配设备的宽度initial-scale=1.0：设置默认缩放比例maximum-scale=1.0：最大缩放比例user-scalable：禁用缩放在iOS 10以前和Android都可以通过一行meta标签来禁止页面缩放，但是在IOS10开始meta设置在Safari内无效了IOS10之后就要使用下面的方法给body标签设置一下css属性。
2024-02-22 17:42:10
379
原创 vue setup 自定义组件名
在 中可使用 defineOptions 宏，以便在 中使用 Options API。尤其是能够在一个函数中设置 name、props、emit 和 render 属性
2023-01-14 22:57:26
527
原创 rebase交互式变基
下面就是vim操作了，只要交换第一行和第三行的位置就行，把光标移动到第一行快速按两下d键第一行就被剪切到剪切板中了，再把光标移动到d提交那行按下p就把刚才剪切的内容粘贴过来了，像这样操作把。提交，你将有机会修订提交，也就是说，可以完全添加或更改提交。这样您可以将大提交拆分为小提交，或者删除在提交中执行错误更改。可以完全添加或更改提交。这使您可以将大型提交拆分为较小的提交，或者删除在提交中所做的错误更改。提交只是合并到其上面的提交，之前提交的消息用于描述两次更改。后面提交的地方，但是列出的不包括指定的提交。
2022-11-17 13:59:28
859
原创 centos7安装mysql8.0
打开mysql的官网，如下图选择对应的版本，CentOS 是基于红帽的，Select OS Version: 选择 linux 7。下载完安装包后，传到要安装的centos电脑上，
2022-11-17 13:39:26
354
原创 Java Script可以直接修改函数的形参吗？
最近公司有一个项目出现了bug让我去解决，发现之前的同事直接在函数里面修改了形参导致的问题那么Java Script可以直接修改函数的形参吗？我们看一下下面的几个例子。var a = 10;function fn(a) { a = 20; console.log(a, arguments[0]); // 20 20}fn(a)console.log(a) // 10变量a没有被修改var param = { name: 'Jack', age: '18',}funct
2022-01-13 19:39:14
318
原创 DOM选择器
含义代码选择class为box的元素document.getElementsByClassName(“box”)[0];子选择器 选择所有的子元素children var aChild = box.children;父选择器 选择一个父元素oparent var oparent = box.parentNode;选择第一个子元素firstElementChild box.firstElementChild;选择最后一个子元素 lastElementC...
2022-01-08 12:51:33
750
原创 Ubuntu下使用Jenkins搭建前端自动化部署
使用Jenkins编译前端环境不仅需要安装jenkins还要安装nodejs，git和Java。安装Java如果已经安装了Java可以跳过此步骤如果不确定是否已经安装了jre可以运行java -version命令，查看jer的版本，看到一下信息说明没有安装jer。Command 'javac' not found, but can be installed with:apt install openjdk-11-jdk-headless # version 11.0.11+9-0ubuntu2
2021-09-04 12:30:20
771
原创 TypeScript接口
1.接口的定义在面向对象的编程中，接口是一种规范的定义，它定义了行为和动作的规范，在程序设计里面，接口起到了限制和规范作用。接口定义了某些类所需要遵守的规范，接口不关心这些类的内部状态数据，也不关心这些类里面的方法实现细节，它只规定这些类里必须提供某些方法，提供这些方法的类可以满足实际需要。typescript中的接口类似于Java，同时还增加了跟灵活的接口类型，包括属性、函数、可索引和类等。2.接口类型属性类接口函数类型接口可索引接口类类型接口接口的继承3.示例3.1属性类接口定义
2021-06-06 21:17:14
125
原创 解决IOS上无法选择文件问题
问题描述：这个问题目前只在ios系统上有发现，使用createElement创建input在ios上无法执行onchange事件，如一下代码：const input = document.createElement('input')input.setAttribute('type', 'file');input.setAttribute('accept', 'image/*'); // 文件类型input.setAttribute('multiple', 'multiple'); //多选in
2021-03-01 18:31:21
1745
1
原创 解决企业微信提示String(...).padStart is not a function(…)错误
这是因为企业微信内核版本太低不支持padStart这个方法，在User-Agent参数里内核是Chrome/53.0.2785.116。既然企业微信不支持padStart()，那么我们只能自己在String的原型上添加方法了。参考下面代码，将下面的代码添加到head里。注意一定要放到head里让他在body之前被执行。if (!String.prototype.padStart) { String.prototype.padStart = function padStart(targetLe.
2021-03-01 14:25:55
2438
1
原创 在Ubuntu上使用Apache2搭建一个web服务器
Apache2 web服务器的安装：第一部选安装apache2apt install apache2 -y安装完毕后，我们检查是否启动了Apache服务systemctl status apache2我们再来看看一些操作Apache的常用命令/etc/init.d/apache2 start //启动Apache服务/etc/init.d/apache2 stop //停止Apache服务/etc/init.d/apache2 restart //重启Apache服务下
2020-09-28 16:13:37
1383
原创 什么是防抖&节流？如何在react项目中使用防抖节流
防抖在n秒后执行，如果在n秒内触发，n就会重新计算，/** fn [function] 需要防抖的函数* wait [number] 毫秒，防抖期限值*/function debounce(fn, wait) { var timeout = null; return function (e) { clearTimeout(timeout); timeout = setTimeout(() => { fn.apply(t
2020-09-27 17:08:11
885
原创 Axios最完整封装适用于Vue、React
import axios from 'axios';import Toast from "zarm/lib/toast"import "zarm/lib/toast/style/css"let appId = "sdjhb-jdhoo-f265-djbhfj-iui" //应用识别码，会在每一个url地址上拼接这个属性let stayTime = 3000 //设置zarmUI库Toast（轻提示）组件的停留时间/** * 设置超时时间和跨域是否允许携带凭证 */axios.de.
2020-09-25 16:03:19
211
原创 如何在react项目中使用sass
安装使用npm 或 yarn安装sassnpm node-sass -D# oryarn node-sass -D安装号之后就可以写样式了，以前叫app.css现在可以改成，app.scss。如果使用了模块化就在.scss的后面加上module，在引入的时候需要用变量来接收一下，如：import app from '../app.module.scss'使用：<div c...
2020-04-25 16:35:02
1368
原创 React跨域代理
在src下新建一个setupProxy.js文件，用npm或yarn安装http-proxy-middlewareconst { createProxyMiddleware } = require('http-proxy-middleware'); //需要安装中间件module.exports = function(app) { app.use( createPr...
2020-04-16 20:02:28
131
原创 React常用生命周期介绍
挂载（创建）当组件实例被创建并插入 DOM 中时，创建阶段的生命周期函数在在组件的一生中只执行一次。其生命周期调用顺序如下：componentWillMount()此时props和state以及函数都已经加载完毕但是内存中的虚拟DOM还没有开始渲染render()当执行render是就已经开始渲染虚拟DOM了，render执行完虚拟DOM就创建好了，但是还没有挂载到真实的...
2020-04-14 17:28:04
312
原创 Vue项目上线_nginx
准备：使用npm run build将Vue项目打包，得到一个dist文件夹，并上传到服务器。在服务器上安装nginxapt-get install nginx配置/etc/nginx/nginx.conf文件配置：在http{}里添加server，server是虚拟主机配置，一个站点就是一个server server { listen 80 ssl; #...
2020-04-14 11:26:13
226
原创 Vue生命周期
什么是生命周期：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！生命周期钩子：就是生命周期事件的别名而已；生命周期钩子 = 生命周期函数 = 生命周期事件主要的生命周期函数分类：创建期间的生命周期函数：beforeCreate：实例刚在内存中被创建出来，此时，还没有初始化好 data 和 methods 属性created：实例已经在内存中创建O...
2020-03-25 15:56:17
120
原创 Vue的自定义指令（directives）
directives自定义指令，是一个对象，属性就时自定义指令的名称，对象的值是一个函数函数的第一个参数是使用这个指令的元素，参数2是传递过来的值 var vm = new Vue({ el:'#app', data:{ bookList: ['神雕侠侣','射雕英雄传','倚天屠龙记'] }, //...
2020-03-24 20:24:04
639
原创 Vue消息订阅与发布
在Vue的原型上定义一个变量bus,在所有的组件里都可以这个变量，使用this.bus.$emit()发布消息，this.bus.$on订阅消息<!-- 在Vue的原型上定义一个变量bus，所有Vue的实例或组件都将共享这个bus，可以用bus来发布消息或订阅消息 --> Vue.prototype.bus = new Vue(); new Vue({ ...
2020-03-24 14:43:13
1906
原创 正则表达式
在使用JS做验证的过程中，一个简单的验证规则的实现非常的麻烦。如：从杂乱的字符串中找数字 var str = "asd68asd687as6da78sd123123zcacas" var linshi=''; var arr=[] for(var i = 0 ; i < str .length ; i ++){ if(str.charAt(i)>=0&&am...
2019-12-14 17:01:23
152
原创 JavaScript设计模式
设计模式：什么是设计模式：是一套经过反复使用、多人知晓的、经过分类的、代码设计经验的总结为什么使用设计模式：为了代码的可重用性、让代码更容易被他人理解、保证代码的可靠性。设计模式使代码的编写真正的工程化；设计模式是软件工程的基石脉络，如同大厦的结构有哪些设计模式（来自W3school，23种）：构造器模式，模块化模式，暴露模块模式，单例模式，中介者模式，原型模式，命令模式，外观模式，工...
2019-12-14 16:18:17
521
原创 块级格式化上下文（BFC）
首先要弄明白什么是常规流（普通流）行元素会从左向右水平排列垂直方向上一次排列，直到该行被占满才会换行，块元素的特性是独占一行当width未设置时会自动填充满父容器，常规流块盒之间的margin会合并，块状元素之间的margin会合并。快元素的margin-top会向父级传递。BFC是什么：BFC 直译为"块级格式化上下文"它是一个独立的渲染区域，它规定了该区域的布局流向，BFC包含创建它的...
2019-10-28 10:57:46
206
1
原创 JavaScript循环练习
JavaScript循环练习入职薪水10K，每年涨幅5%，第50年工资多少var sum = 10;for (var i = 1;i<=50;i++) { sum += sum*0.05;}console.log(sum);打印100以内7的倍数for (var i = 1;i <=100;i++) {if (i%7==0) { console.log...
2019-10-24 14:01:56
605
2
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人