const containerRef: any = useRef(null)
const mutationObserver = () => {
let MutationObserver = window.MutationObserver
const options = { // 配置参数
attributes: true, // 属性的变动
characterData: true, //节点内容或节点文本的变动
subtree: true // 布尔值,表示是否将该观察器应用于该节点的所有后代节点
}
const mutation = new MutationObserver((mutationRecoards) => {
// Demo发生变化的处理
if (!containerRef.current) return
if (containerRef.current.clientHeight > 424) {
containerRef.current.style.height = "424px"
}
})
mutation.observe(containerRef.current, options); // 开启监听
// 其他配置参数
// childList 子节点的变动(指新增,删除或者更改)
// attributeOldValue 布尔值,表示观察attributes变动时,是否需要记录变动前的属性值
// characterDataOldValue 布尔值,表示观察characterData变动时,是否需要记录变动前的值
// attributeFilter 数组,表示需要观察的特定属性(比如[‘class’,‘src’])
React中使用window.MutationObserver监听Demo变化处理
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- 1. 背景 一般前后端使用的是Json格式的报文来进行交互,而SpringBoot默认采用Jackson来帮助我们...
- 如果你点开了这篇文章,说明你已经开始注意到redux了,网上关于redux的介绍很多,此处不多介绍了. 网上关于r...
- 本文主要是以我的另一篇文章的思维过程来操作,希望大家使用后可以记住整个过程,从而活学活用,使用到自己的项目中.参考...
- 在react和vue都一般都会使用一个全局的request方法进行http请求在该方法中需要对200之外的状态码进...