// 被观察的目标对象
let obj = { name: 'zyc', csdn: '博客'};
// 观察者
function print() {
console.log('对象被操作了!');
}
// 使用proxy代理
const observeObj = (obj) => new Proxy(obj, {set, get});
// 消息队列
const observeQueue = new Set();
const observe = (fn) => observeQueue.add(fn);
// 设置
function set(target, key,...阅读全文>>
在做一个移动端项目时，用swiper 做的页面切换，但是页面里面还会有swiper轮播图 和其他内容，在滑动外部swiper时，除开里面swiper的元素会发生闪动的情况。
解决方法：给外部元素的父标css套一个：transform:translate3d(0,0,0);overflow:hidden;
闪动元素/子元素：transform:translate3d(0,0,0)阅读全文>>
安装mysql
$ yarn add mysql
建立连接池、常用sql语句
// mysql.js
const mysql = require('mysql');
// 创建连接池
const pool = mysql.createPool({
host: 'xxx.xx.xxx.xxx', // 服务器ip
port: 3306, // mySql运行的端口号(默认3306)
database: 'name', // 数据库名称
user: 'user', // 数据库用户
passwor...阅读全文>>
network面板通过基座加载子应用时候，出现了一个js文件404
这里面很蹊跷，因为子应用单独可以启动，子应用被基座家加载时候只有一个js文件404了，而且是一个异步加载的js,那么可以判断，肯定是加载逻辑这块出了问题
在子应用中调试，打开public-path文件发现没有运行
核心问题是：当时发现子应用的__webpack_publicPath__这个变量没有被修改，所以造成了请求的host不对，异步加载的js文件404了
文件被webpack5给tree sharking了
在package.json中添加的sideEffects字段
...阅读全文>>
MyPromise.any = function(promises){
return new Promise((resolve,reject)=>{
promises = Array.isArray(promises) ? promises : []
let len = promises.length
// 用于收集所有 reject
let errs = []
// 如果传入的是一个空数组，那么就直接返回 AggregateError
if(len === 0) return reject(new AggregateE...阅读全文>>
useEffect 在以下两种情况下会执行两次。
仅在开发模式下：这是每个人本地开发时构建应用的模式。
在严格模式下：这个是在使用 create-react-app 或者 Next.js 构建应用时的默认模式。
阻止 useEffect 执行两次的方法只有一个，那就是 关闭严格模式
在 Next.js 中
你可以在 next.config.js 配置文件中关闭严格模式：
reactStrictMo...阅读全文>>
https://github.com/Tencent/nohost阅读全文>>
husky升级8.0.1之后
运行pnpm husky install阅读全文>>
class类组件：
// 定义组件
class MyComponent<P> extends React.Component<P> {
internalProp: P;
constructor(props: P) {
super(props);
this.internalProp = props;
}
render() {
return (
<span>hello world</span>
);
}
}
// 使用组件
type IProps = { n...阅读全文>>
类组件中
React.createRef()
优点：通俗易懂，用ref指向。
缺点：使用了HOC的子组件不可用，无法指向真是子组件
比如一些常用的写法，mobx的@observer包裹的子组件就不适用此方法。
import React, { Component } from 'react';
class Sub extends Component {
callback() {
console.log('执行回调');
}
render() {
return <div>子组件</div>;
...阅读全文>>
