- 博客(53)
- 收藏
- 关注
RSS订阅
原创 ant design vue table表格插槽slot问题
在做表格时我们想操作表格怎么插入那些操作呢？这是官网给出的例子https://www.antdv.com/components/table-cn/下面是我写的插槽 <a-table :pagination="paginationOpt" :columns="columns1" :dataSource="data1" ...
2020-02-24 14:53:01
27440
2
原创 二次封装el-carousel
最后，同个点击上面的tab切换到不同的图片上，同理，切换不同的轮播图，上面的tab也会跟着动，双向的联动。的一些常用属性作为props，并默认提供了一些值。函数返回了所有props，以便它们可以在模板中被使用。
2024-04-23 14:23:23
291
原创 【无标题】Vue3想在scss中想使用动态的变量
首先在组件中定义 :style="{ '--custom-style-color': customStyle.color }",customStyle.color就是那个传过来的变量，也可以是自定义的-color 值。var(--custom-style-color)就是那个可以使用的变量了。Vue3想在css中想使用动态的变量。
2023-12-06 14:40:20
784
原创 解决图片是svg代码，鼠标悬停到svg,想换个颜色
在上述代码中，我们可以使用fill属性来改变SVG的颜色。其中，fill属性值可以是任何CSS颜色值，包括十六进制颜色代码、RGB颜色代码等。例如，fill="#B7B7B7"就表示填充灰色。SVG是指可伸缩矢量图形，是一种基于XML语法的图形格式。在想实现一个右上角显示一个小图片，作为固定钉的功能，悬停时想换一个颜色，想要有一个互动的效果。在svg标签加上id="svg-icon"，fill="#B7B7B7"都去掉，在样式style,写上自己的代码即可。
2023-11-24 09:55:42
461
原创 对象·map·set·正则
对象访问属性： 点符号: obj.name。 方括号 obj["name"]，方括号允许从变量中获取键，例如 obj[varWithKey]。删除对象的属性：delete obj.prop。检查是否存在给定键的属性："key" in obj。遍历对象：for(let key in obj) 循环。检查空对象：isEmpty(obj) 函数，当对象没有属性的时候返回 true，否则返回 false可选链 ?. 语法有三种形式：obj?.prop —— 如果 obj 存在则返回 ob...
2021-02-22 17:30:56
613
原创 js数据类型（1）
js判断数组中是否包含某个值：array.indexOf(item[,start]) 返回Number，元素在数组中的位置，如果没有搜索到则返回 -1。 array.includes(searcElement[,fromIndex]) 返回布尔值。如果找到指定值返回 true，否则返回 false。 array.find(callback[,thisArg]) 返回符合测试条件的第一个数组元素值，如果没有符合条件的则返回undefined。 array.findeIndex(call...
2021-02-02 14:20:48
109
原创 2021-01-22
Sass 变量变量用于存储一些信息，它可以重复使用。Sass 变量可以存储以下信息：字符串 数字 颜色值 布尔值 列表 null 值Sass 变量使用$符号：$variablename: value;// sass$myColor: red;$myFontSize: 18px;$myWidth: 680px;body { font-size: $myFontSize; color: $myColor;}.container { widt..
2021-01-22 10:55:14
87
原创 2021-01-19 Array 常用对象方法
Array 对象方法方法 描述 concat() 连接两个或更多的数组，并返回结果。 array1.concat(array2,array3,...,arrayX) fill() 使用一个固定值来填充数组。 array.fill(value, start, end) every() 检测数值元素的每个元素是否都符合条件。 array.every(function(currentValue,index,ar
2021-01-19 16:18:46
104
原创 2021-01-19 String 常用对象方法
indexOf() 返回某个指定的字符串值在字符串中首次出现的位置（索引值），如果没有找到匹配的字符串则返回 -1。 string.indexOf(searchvalue,[start]) searchvalue检索的字符串,start开始检索的位置 lastIndexOf() 从后向前搜索字符串，并从起始位置（0）开始计算返回字符串最后出现的位置。如果指定第二个参数 start，则在一个字符串中的指定位置从后向前搜索。开始检索的位置在字符串的 ...
2021-01-19 09:43:39
79
翻译 Angular生命周期
Angular生命周期的钩子执行顺序生命周期钩子接口 钩子 用途 OnChanges ngOnChanges(changes: SimpleChanges) 在组件有绑定值的时候，在绑定值发生变化的时候调用，在ngOninit()之前，任何一个、多个绑定值发生变化的时候都会调用,在这个钩子中，可以有一个SimpleChanges类型的参数，这个参数可以看到绑定的是和上一次发生变化，并可以判断是否是第一次变化。 OnInit ngOnInit() 组件在数据、指
2021-01-04 16:16:44
101
原创 前端promise、async、await和setTimeout的执行顺序
一、微任务与宏任务执行顺序微任务队列只有一个，宏任务队列可以有多个。宏任务包括：script(全局任务), setTimeout, setInterval, setImmediate, I/O, UI rendering微任务包括： new Promise().then(回调), process.nextTick, MutationObserver(html5新特性)1. 主进程必须是空闲的状态，如果到时间了，主进程不空闲也不会执行你的回调函数2. 这个回调函数需要等到插入异步...
2020-12-28 16:35:44
862
原创 内连接、外连接多表联合查询
内连接可以把INNER JOIN想成两个集合的交集，INNER JOIN 连接表的语法：SELECT column, another_table_column, … FROM mytable （主表） INNER JOIN another_table （要连接的表） ON mytable.id = another_table.id (主键连接，两个相同的连成1条)HERE condition(s) ORDER BY column, … ASC/DESC LIMIT num_.
2020-12-28 16:24:01
1041
原创 查询SQL语句
1.Select 查询所有列SELECT * FROM mytable（表名）2.Select 查询某些属性列(多列用逗号分隔开)的语法:SELECT column（列名）, another_column, …FROM mytable（表名）;SELECT查询的WHERE子句，WHERE子句用来描述哪些行应该进入结果，具体就是通过条件限定这些行的属性满足某些具体条件3.条件查询语法SELECT column, another_column, … FROM myta..
2020-12-28 15:53:50
216
2
原创 and design 接口传过来指定日期能选择，其余禁止选中
采用的是angular+and design的框架，是在做项目的时候遇到的一个难题，由此来记录一下。angular的ant.design地址 /* 网上看到的=====日期禁用 */const disabledDate = (current,arr) =>{ let ff = false; ff = !arr.some((son,index,arr) => { return current.isSame(son,'day') }) return ff;.
2020-12-22 19:05:26
171
原创 获取本周-本月 -本季 -本年时间段
/** * 获取区间数据 * @param {number} flag 1 -本周、2 -本月、3 -本季、4 -本年 */export const getQj = (flag: number = 1): object => { let params = {}; const date = new Date(); if (flag === 1) { const cWeek = moment(date).format('E'); ..
2020-12-18 09:39:09
170
原创 git命令
初始化一个Git仓库，使用git init命令。添加文件到Git仓库，分两步： git add <file>，注意，可反复多次使用，添加多个文件； git commit -m <message>，完成。如果不用git add到暂存区，那就不会加入到commit中推送并建立关联关系: 推送本地分支local_branch到远程分支 remote_branch并建立关联关系 a.远程已有remote_branch分支并且已经关联本地分支lo...
2020-12-16 15:30:43
68
原创 Angular路由
Angular4检测路由变化，可以使用router.events来监听：支持的事件类型：NavigationStart：导航开始 NavigationEnd：导航结束 NavigationCancel：取消导航 NavigationError：导航出错 RoutesRecoginzed：路由已认证在判断事件类型需要导入对应的事件类型，如：import{Router,NavigationStart}from'@angular/router';监听单一事件thi...
2020-12-04 09:00:07
158
原创 2020-11-24/angularjs
ng-modelng-model 指令用于绑定应用程序数据到 HTML 控制器(input, select, textarea)的值。ng-model指令可以为应用数据提供状态值(invalid, dirty, touched, error)ng-model指令根据表单域的状态添加/移除以下类：ng-empty ng-not-empty ng-touched ng-untouched ng-valid ng-invalid ng-dirty ng-pending ng-p..
2020-11-24 14:55:55
116
原创 2020/11/18面试题
ES6新的特性有哪些？新增了块级作用域(let,const) 提供了定义类的语法糖(class) 新增了一种基本数据类型(Symbol) 新增了变量的解构赋值 函数参数允许设置默认值，引入了rest参数，新增了箭头函数 数组新增了一些API，如 isArray / from / of 方法;数组实例新增了 entries()，keys() 和 values() 等方法 对象和数组新增了扩展运算符 ES6 新增了模块化(import/export) ES6 新增了 Set 和 Map 数据
2020-11-18 22:23:45
129
原创 前端性能优化
性能优化：一、减少请求资源大小或者次数 1、尽量和并和压缩css和js文件。（将css文件和并为一个。将js合并为一个） 原因：主要是为了减少http请求次数以及减少请求资源的大小 打包工具： webpack gulp grunt. ....2、尽量所使用的字体图标或者SVG图标来代替传统png图 因为字体图标或者SVG是矢量图，代码编写出来的，方大不会变形，而且渲染速度快3、采用图片的懒加载（延迟加载） 目的为了，减少页面第一次加载过程中http的请求次数
2020-11-05 18:04:18
121
原创 总结面试题
问：行内元素和块元素的区别行内元素：内容多少就占多大的空间 与其他行内元素并排 不能设置宽高，默认宽度就是文字的宽度块元素：不管内容多少，总是在浏览器中独占一行。 可设置宽高，如果不设置宽高那宽度是100%行内块元素：共享一行，可设置宽高，多个行内元素排列在一起块级元素和行内元素相互转换：通过display属性 display:inline; // 转换成行内元素 display:block; // 将行内元素转换成块级元素 display:inline-block; .
2020-11-05 18:03:30
73
原创 面试1
网络：1、url输入到页面的全过程 1、浏览器构建HTTP Request请求 2、网络传输 3、服务器构建HTTP Response响应 4、网络传输 5、浏览器渲染页面js:1、基本数据类型 可分为基本数据类型和复合数据类型两种. 基本数据类型有五种：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）; 复合数据类型有三种（一组无序的键...
2020-11-04 18:34:51
141
原创 页面性能优化
web 前端开发，如何提高页面性能优化？内容方面：1.减少 HTTP 请求 (MakeFewerHTTPRequests)2.减少 DOM 元素数量 (ReducetheNumberofDOMElements)3.使得 Ajax 可缓存 (MakeAjaxCacheable)针对 CSS：1.把 CSS 放到代码页上端 (PutStylesheetsattheTop)2.从页面中剥离 JavaScript 与 CSS(MakeJavaScriptandCSSExternal)3.精简 J
2020-10-29 22:01:32
207
原创 原型和原型链
function Person(){} // 构造函数 Personlet person = new Person() // 实例化Person 就是构造函数，Person.prototype 就是原型prototype显示原型原型指的就是一个对象，实例“继承”那个对象的属性。在原型上定义的属性，通过“继承”，实例也拥有了这个属性。“继承”这个行为是在 new 操作符内部实现的。_proto_ 隐式原型实例通过__proto__访问到原型，所以如果是实例，那么...
2020-10-28 16:40:36
108
原创 2020-10-27面试题目
function Faisco(){ getVlue=function(){ console.log('价值观') } return this}Faisco.getVlue = function(){ console.log('正直')}Faisco.prototype.getValue = function(){ console.log('务实')}getVlue()var getVlue = function (){ console.log('1111')}func.
2020-10-27 21:36:31
82
原创 防抖和节流
防抖函数分为非立即执行版和立即执行版。非立即执行版：function debounce(func, wait) { let timeout; return function () { let context = this; let args = arguments; // 为了让 debounce 函数最终返回的函数 this 指向不变以及依旧能接受到 e 参数 if (timeout) clearTimeout(t
2020-10-27 21:00:07
94
原创 面试题--promise和setTimeout的输出顺序
下面的代码输出的结果是什么？为什么？setTimeout(function () { var np =new Promise(function (resolve,reject) { console.log(1) resolve() }) np.then(_=>{ console.log(2) }) console.log(3)},1000)var pro = new Promise((resolve, reject) => { console.log(5).
2020-10-27 20:40:57
503
原创 js运行机制
一、JS的单线程JavaScript语言的一大特点就是单线程，也就是说，同一个时间只能做一件事二、任务队列(消息队列)单线程就意味着，所有任务需要排队，前一个任务结束，才会执行后一个任务。如果前一个任务耗时很长，后一个任务就不得不一直等着。JavaScript语言的设计者意识到这个问题，将所有任务分成两种，一种是同步任务（synchronous），另一种是异步任务（asynchronous）。同步任务指的是，在主线程上排队执行的任务，只有前一个任务执行完毕，才能执行后一个任务；异步任务指
2020-10-22 16:10:57
73
原创 2020-10-20面试题
1、http请求的方式get和post的区别包括1.get是从服务器上获取数据，post是向服务器传送数据。2.get是把参数数据队列加到提交表单的ACTION属性所指的URL中，值和表单内各个字段一一对应，在URL中可以看到。post是通过HTTPpost机制，将表单内各个字段与其内容放置在HTML HEADER内一起传送到ACTION属性所指的URL地址。用户看不到这个过程。3.对于get方式，服务器端用Request.QueryString获取变量的值，对于post方式，服务器端用Requ
2020-10-22 14:38:09
225
原创 Vue 双向绑定原理
### Vue 双向绑定原理mvvm 双向绑定，采用**数据劫持结合发布者-订阅者模式**的方式，通过 `Object.defineProperty()` 来劫持各个属性的 setter、getter，在数据变动时发布消息给订阅者，触发相应的监听回调。**几个要点：**1、实现一个数据监听器 Observer，能够对数据对象的所有属性进行监听，如有变动可拿到最新值并通知订阅者2、实现一个指令解析器 Compile，对每个元素节点的指令进行扫描和解析，根据指令模板替换数据，以及绑定相应的更新函数3、
2020-09-21 22:20:18
127
原创 防抖和节流
https://www.jianshu.com/p/c8b86b09daf0防抖（debounce）所谓防抖，就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。防抖函数分为非立即执行版和立即执行版。节流（throttle）所谓节流，就是指连续触发事件但是在 n 秒中只执行一次函数。节流会稀释函数的执行频率。对于节流，一般有两种方式可以实现，分别是时间戳版和定时器版。...
2020-09-17 09:49:31
373
原创 2020-09-09面试题
html1、 html5新特性2、html语义化的理解3、w3c标准css1、css选择器有哪些2、css权重问题3、position三个属性的区别4、css3新特性5、css盒子模型6、css不知道宽高的情况下如何居中（说上2-3个方法）7、BFC理解8、rem em 区别 vw和 vh问题9、有时候也会问一下scss less变量函数定义问题js1、es6合并对象的方法方法一：let o1 = { a:1, b:2, c:3 };let o2 = {....
2020-09-09 18:47:32
1603
原创 css
1.calc, support, media各自的含义及用法？@support主要是用于检测浏览器是否支持CSS的某个属性，其实就是条件判断，如果支持某个属性，你可以写一套样式，如果不支持某个属性，你也可以提供另外一套样式作为替补。calc() 函数用于动态计算长度值。 calc()函数支持 "+", "-", "*", "/" 运算；@media 查询，你可以针对不同的媒体类型定义不同的样式。1.css水平、垂直居中的写法，请至少写出4种这题考查的是css的基础知识是否全面，所以.
2020-09-09 17:22:34
85
原创 uni-app
最近在做一个小项目，使用到了uniApp，也是新手一枚，记录踩到的一些坑uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉/淘宝）、快应用等多个平台。开始之前，开发者需先下载安装如下工具：HBuilderX：官方IDE下载地址HBuilderX是通用的前端开发工具，相关教程官网写的非常清楚，有需要自行进去查看，这是他们的官网uniapp官网。1.封装reques...
2020-09-03 18:32:13
165
原创 react安装步骤
1.安装react 首先你要确定已经安装node.jsnpx create-react-app my-app or yarn create react-app my-app cd my-appnpm start or yarn start安装成功后：执行npm start来启动项目,会自己跳转到http://localhost:3000/，...
2020-09-02 15:00:06
154
原创 实现当前日期以及一周后的日期和星期几
上效果图：实现今天开始一周后的日期和星期的方法： getAfterDate(n) { // n是今天之后的天数，n=1 -> 明天 var d = new Date(); // 当前时间 var year = d.getFullYear(); // 年 var month = d.getMonth() + 1; // 月 var day = d.getDate(); // 日 var hou
2020-08-28 15:33:42
329
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人