日常小笔记

跳过eslint验证

/* eslint-disable */

参考地址

web端连接微信云数据库

参考地址

刚安装完的yarn或者cnpm,禁止运行脚本问题解决

PowerShell，以管理员身份运行
输入 set-ExecutionPolicy RemoteSigned
A/Y

参考地址

本地服务器

image.png

sourcetree 下载

下载地址
初始问题报错解决

git 通过ssh拉取代码

参考地址

slot-scope 插槽属性

 <slot  name="haha"  :row="data"  />
...
<template slot="haha" slot-scope="{row}">{{row.name}}</template>
// or
<template slot="haha" slot-scope="scope">{{scope.row.name}}</template>

sass sass-loader

"sass": "1.26.8",
"sass-loader": "8.0.2",

阻断请求

return Promise.reject(new Error(res.message || "Error"));

namespaced: true时的调用

 this.$store.commit("app/SET_APP_INFO", appInfo);

input file文件上传路径预览

     const file = e.target.files[0];
      console.log(file.type); //上传文件的类型
      let src = window.URL.createObjectURL(file);

:last-child 不生效问题

父元素底下只能有class为limit-top的列表才可以,如果你遇到这个问题,直接列表外面包一个div就好了

蓝湖rem换算公式

蓝湖设计图机型尺寸：750 * 2046
开发机型尺寸：414 * 736
30px = 750/414*16

image.png

input 获取焦点可能失效问题解决

//失效
this.$refs['input'].focus()

//成功 不用ref绑定，使用原生id获取
 document.getElementById("input").focus();

base64加密解密

import { Base64 } from "js-base64";
...
 Base64.encode() //加密
Base64.encodeURI() //用于加密URL
Base64.decode() //解密 也可以解密 encodeURI

yarn cnpm 安装失败等

也有可能是在环境变量中未配置
参考地址

生成一个随机随

    function random(min, max) {
        return Math.floor(Math.random() * (max - min)) + min;
    }

数组去重复

function unique(arr) {
    if (!Array.isArray(arr)) {
        console.log('type error!')
        return
    }
    var array = [];
    for (var i = 0; i < arr.length; i++) {
        if (array .indexOf(arr[i]) === -1) {
            array .push(arr[i])
        }
    }
    return array;
}

.toLocaleString()方法

var d=new Date();
var n=d.toLocaleString();//2020/11/6 上午9:46:51

let num=12345678;
console.log(num.toLocaleString()); // 12,345,678

查找字符串是否包含 "Runoob":

var str = "Hello world, welcome to the Runoob。";
var n = str.includes("world"); //true

把数组内相似的对象合并到一个数组中

   let arr1 = [],
        arr2 = []
      let newObj = _.cloneDeep(row)
      // console.log(newObj.subTaskTemplates);
      let num = 0
      // 对编辑的数据进行重排，把taskGroupId相似的重新组合成一个任务组分类
      newObj.subTaskTemplates.forEach(item => {
        // taskGroupId为0的默认为子任务，不需要进行任务组分类
        if (arr1.includes(item.taskGroupId) && item.taskGroupId !== 0) {
          let index = arr1.findIndex(item2 => item2 === item.taskGroupId)
          item.id = item.id
          arr2[index].subTaskTemplates.push(item)
        } else {
          arr1.push(item.taskGroupId)
          let obj = {
            id: item.id,
            pause: item.pause,
            taskGroupId: item.taskGroupId,
            taskTemplateId: item.taskTemplateId,
            type: item.type,
            subTaskTemplates: [item]
          }
          arr2.push(obj)
        }
      })
      console.log(arr1, arr2)

      arr2.forEach(item => {
        if (item.subTaskTemplates.length <= 1) {
          delete item.subTaskTemplates
        }
      })
      newObj.subTaskTemplates = arr2
      this.$refs['taskTemplate'].ruleForm = { ...newObj }
      console.log(this.$refs['taskTemplate'].ruleForm)

解决 flex-grow 内容撑开问题

 flex-basis:0; 
 align-self: baseline;

解决 flex 图片拉伸问题

flex-shrink:0;

解决表格td内容撑大

table-layout: fixed; 

高亮搜索的文字

  //高亮文字方法
  const highlightText = (search, text) => {
    /**
     * s 检索文字
     * t 结果文字
     */
    let sArr = search.split('');
    let tArr = text.split('');
    return tArr.map(t => {
      let red = false
      sArr.map(s => {
        if (s === t) {
          red = true
        }
      })
      if (red) {
        return <span className={styles.red}>{t}</span>;
      } else {
        return <span>{t}</span>;
      }
    })
  };

移动端滚动穿透问题

 document.body.style.overflow = 'hidden';
 document.body.style.overflow = 'auto';

input 默认147px长度问题

<input
            name="tel"
            type="text"
            style={{width:'100%'}}
          />

@media媒体查询适配

//小于 414px 尺寸的手机采用这个字体
 @media screen and (max-width: 721px) {
     html{
         font-size: 22.5px;
         background-color: red;
     }
 }

element-ui 表格多选

参考文档参数地址

image.png
image.png

element-ui 表格列用v-if造成错乱的问题

给每列加上一个 key

  <el-table-column  key="1" label="权益人信息" v-if="activeName == '3'"></el-table-column>
  <el-table-column  key="2" label="成交房信息" v-if="activeName == '4'"></el-table-column>