数据处理
数据处理(去掉数据的左右空格)123456789101112131415161718192021222324 // 去掉包括空格,存储名称两端多余空格 export const multipleSpace = (str, needTrim = true) => { if (typeof str === "string") { let _str = ""; const arr = str.split(/\n/); if (arr && arr.length) { arr.forEach((v, i) => { const re = v.replace(/\s+/g, " "); _str = _str + (i !== 0 ? "\n" : "") + (needTrim ? re.trim() : re); ...
React18 更新
React18中 children 属性已经在函数组件中被移除,如果需要使用 children 属性,则需要手动声明。
第一种方法,手动声明 children 属性。
12345import * as React from 'react';type Props = { children?: React.ReactNode};const Component: React.FC<Props> = ({children}) => {...}
第二种方法,使用 PropsWithChildren 辅助属性。
123import React, { PropsWithChildren } from 'react';type Props = {};const Component: React.FC<PropsWithChildren<Props>> = ({children}) => ...
前端跨域
什么是跨域?跨域,是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对JavaScript实施的安全限制。
说白了跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。
跨域解决方案通过jsonp跨域
document.domain + iframe跨域
location.hash + iframe
window.name + iframe跨域
postMessage跨域
跨域资源共享(CORS)[主流,推荐]
nginx代理跨域 [主流,推荐]
node.js中间件代理跨域[推荐]
WebSocket协议跨域
通过解决方案实现(部分用过的方式)通过 jsonp 跨域12345678910111213141516171819202122232425262728293031323334通常为了减轻web服务器的负载,我们把js、css,img等静态资源分离到另一台独立域名的服务器上,在html页面中再通过相应的标签从不同域名下加载静态资源,而被浏览器允许,基于此原理,我们可以通过动态创建script,再请求一个带参网址实现跨域通信。缺点:只能 ...
常用数组方法(持续更新中...)
什么是数组
数组原型方法主要有以下这些12345678910111213141516171819202122232425join():用指定的分隔符将数组每一项拼接为字符串push() :向数组的末尾添加新元素pop():删除数组的最后一项shift():删除数组的第一项unshift():向数组首位添加新元素slice():按照条件查找出其中的部分元素splice():对数组进行增删改fill(): 方法能使用特定值填充数组中的一个或多个元素filter():“过滤”功能concat():用于连接两个或多个数组indexOf():检测当前值在数组中第一次出现的位置索引lastIndexOf():检测当前值在数组中最后一次出现的位置索引every():判断数组中每一项都是否满足条件some():判断数组中是否存在满足条件的项includes():判断一个数组是否包含一个指定的值sort():对数组的元素进行排序reverse():对数组进行倒序forEach():ES5 及以下循环遍历数组每一项map():ES6 循环遍历数组每一项copyWithin():用于从数组的指定位置拷贝 ...
前端进行简单的大屏适配
公共 style 文件下创建 Common.sass 文件进行配置 12345678910111213141516171819@use "sass:math";//根据页面宽度做适配@function vw($px) { @return (math.div(100,1920)) * $px + vw;}//根据页面高度做适配@function vh($px) {@return (math.div(100,1080)) * $px + vh;}//设置字体及颜色@mixin font($family,$size,$color:#FFF) {color: $color;font: { family: $family; size: vw($size);};}
在外部 sass 文件进行调用 12345@import "src/Style/Common";width: vw(100)height: vh(100)
Hexo 使用
Hexo 安装教程环境配置node.js : 下载Hexo : 下载
(安装出现问题自行百度)12345npm install hexo-cli // 下载hexohexo -v // 查看是否安装成功hexo init // 初始化hexo文件夹npm install // 下载模块依赖npm install -g // 全局下载模块依赖
配置 HEXO当我们安装完毕的时候,就需要对 Hexo 进行一些配置,具体是通过_config.yml 文件来完成的
1234567891011.deploy_gitnode_modules //包所需要的依赖public // 静态网页存储的目录scaffolds // 样本source // 我们自己的md文件themes // 主题文件.gitignore_config.yml // 配置db.jsonpackage.jsonpackage-lock.json
本地运行123hexo clean // 删除public文件的内容hexo g // 生成静态文件到publichexo s // 本地运行
发布到服务器123hexo cle ...