博客网

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")
}

把颜色值转换床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();    
  }
};

文本域内容通过回车键进行换行后，提交表单保存到数据库中，数据库保存的内容格式和文本域是一致的。

请求接口后，返回的数据是带有/n换行符的字符串。/n换行符是后端的代码换行的符号，在前端代码中是不展示也不起换行作用。

为了保证页面展示和我们输入一致的换行效果，此时，我们需要对该字段的数据进行处理。可以通过替换方法replace()方法\n替换成浏览器可识别的换行标签进行处理。

summary.replace(/\n/g, '<br/>')

在 Vue 中，data 选项在组件中通常被定义为一个函数，而不是一个对象。主要是因为组件被多次引用，每个组件实例都需要有自己独立的数据状态。

如果你将 data 定义为一个对象，那么所有的组件实例将共享同一个对象引用，这会导致它们之间的数据状态相互干扰。

通过将 data 定义为一个函数，Vue 可以确保每次创建新的组件实例时都会调用这个函数，从而返回一个新的数据对象。这样，每个组件实例都会有自己独立的数据状态

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

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

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

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

按顺序执行的函数为同步请求、同时进行请求的函数为异步请求。

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