博客网

通过CSS设置SVG图标颜色

icon公共样式 .icon{ display: inline-block; width: 16px; height: 16px; transition" all .3s ease } svg图标类样式 .icon-mood{ background-color: #00000; -webkit-mask-image: url("./mood.svg") }

SS变量SVG

CSS十六进制颜色值设置透明度

把颜色值转换床RGB模式 const colorHex2Rgb = (color: any) => { var reg = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/; var sColor = color.toLowerCase(); if(sColor && reg.test(sColor)){ if(sColor.length === 4){ var sColorNew = "#"; for(var i=1; i<4; i+=1){ sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1)); } sColor = sColorNew; } var sColorChange = []; for(var i=1; i<7; i+=2){ sColorChange.push(parseInt("0x"+sColor.slice(i,i+2))); } return "RGB(" + sColorChange.join(",") + ")"; }else{ return sColor; } }; 将RGB模式转换成十六进制 const colorRgb2Hex = (color: any) => { var reg = /^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/; var that = color; if(/^(rgb|RGB)/.test(that)){ var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g,"").split(","); var strHex = "#"; for(var i=0; i<aColor.length; i++){ var hex = Number(aColor[i]).toString(16); if(hex === "0"){ hex += hex; } strHex += hex; } if(strHex.length !== 7){ strHex = that; } return strHex.toUpperCase(); }else if(reg.test(that)){ var aNum = that.replace(/#/,"").split(""); if(aNum.length === 6){ return that; }else if(aNum.length === 3){ var numHex = "#"; for(var i=0; i<aNum.length; i+=1){ numHex += (aNum[i]+aNum[i]); } return numHex.toUpperCase(); } }else{ return that.toUpperCase(); } };

yarn和npm命令对比

npm yarn 注释 npm init yarn init 初始化项目 npm install yarn 安装全部依赖 npm install react –save yarn add react 安装某个依赖，保存到 dependencies npm uninstall react –save yarn remove react 移除某个依赖 npm install react –save-dev yarn add react –dev 安装某依赖,保存到 devDependencies npm update [package] –save yarn upgrade [package] 更新生产环境某个依赖包 npm install axios –global yarn global add axios 全局安装某个依赖 npm install –save axios vue-axios yarn add axios vue-axios 同时下载多个依赖包 npm install [package]@[version] yarn add [package]@[version] 安装指定版本的包 npm rebuild yarn install –force 重新下载所有包

arn命令npm

textarea换行提交，页面未展示换行效果可通过replace处理

文本域内容通过回车键进行换行后，提交表单保存到数据库中，数据库保存的内容格式和文本域是一致的。 请求接口后，返回的数据是带有/n换行符的字符串。/n换行符是后端的代码换行的符号，在前端代码中是不展示也不起换行作用。 为了保证页面展示和我们输入一致的换行效果，此时，我们需要对该字段的数据进行处理。可以通过替换方法replace()方法\n替换成浏览器可识别的换行标签进行处理。 summary.replace(/\n/g, '<br/>')

extarea文本域

vue组件中data为什么不是一个对象？

在 Vue 中，data 选项在组件中通常被定义为一个函数，而不是一个对象。主要是因为组件被多次引用，每个组件实例都需要有自己独立的数据状态。 如果你将 data 定义为一个对象，那么所有的组件实例将共享同一个对象引用，这会导致它们之间的数据状态相互干扰。 通过将 data 定义为一个函数，Vue 可以确保每次创建新的组件实例时都会调用这个函数，从而返回一个新的数据对象。这样，每个组件实例都会有自己独立的数据状态

vue组件

什么是闭包？

闭包是指存在自由变量的函数。在A作用域中使用的变量a，却没有在A作用域中声明（即在其他作用域中声明的），对于A作用域来说，a就是一个自由变量。如下代码

闭包函数

什么是promise，如何去理解和正确使用？

promise是一个构造函数，是用来处理异步操作的解决方式。promise构造函数是同步执行的，then方法是异步执行的

promise异步处理

js数据类型有几种？有什么不同

js的数据类型可分为基本数据类型和引用数据类型。基本数据类型(栈存储)：Undefined，Null，Boolean，Number、String引用数据类型(堆存储)：对象、数组、函数

数据类型基本类型

关于null，undefined 的区别

null 表示一个对象是“没有值”的值，也就是值为“空”。undefined 表示一个变量声明了没有初始化(赋值)。undefined不是一个有效的JSON，而null是。

对象值null

同步请求和异步请求的区别

按顺序执行的函数为同步请求、同时进行请求的函数为异步请求。 区别：同步按顺序执行函数、解析的速度相对异步较慢；异步则相反，先读取完成的函数先执行、解析速度快。

同步请求异步请求