当用户滚动到页面底部时，我使用IntersectionObserver加载数据。: IntersectionObserver;
this.observer= new IntersectionObserver(([entry]) => { },this.requ
浏览 13提问于2020-08-26得票数 0
我编写了一个用react 17.0.2构建的组件，该组件使用react-intersection-observer 9.1.0我使用@testing-library/react 12.1.4和@testing-library/jest-dom 5.16.3编写了一些单元测试，以使组件更安全。一旦我用下面的代码测试上述组件
浏览 30提问于2022-05-07得票数 3
回答已采纳
我的应用程序中有一个(编写得相当糟糕) javascript组件，它处理无限滚动分页，我试图重写它以使用IntersectionObserver，正如描述的，但是我在测试它时遇到了问题。是否有一种方法来驱动QUnit测试中观察者的行为，即用我的测试中描述的一些条目触发观察者回调？我提出的一个可能的解决方案是在组件的原型中公开回调函数，并在我的测试中直接调用它，如下所示：
InfiniteScroll
浏览 10提问于2017-05-29得票数 50
回答已采纳
我正在尝试测试一个组件，该组件包含一个包含react-intersection-observer的子组件，但我总是得到一个错误 我试图导入库，但仍然失败。这是初始测试 beforeEach(() => { document.body.appendChildmain-input");
expect(document.activeEl
浏览 89提问于2019-07-12得票数 10
回答已采纳
我有一个使用交集观察者的组件，并希望在一个jest测试中测试该元素是否相交的效果。我已经成功地模拟了这个答案中的交集观察者： unobserve = () => null, class MockIntersectionObserver implements Int
浏览 1提问于2020-12-09得票数 4
我正在使用Gatsby创建一个网站，并且很难将使用IntersectionObserver的类组件转换为使用钩子的功能组件。我特别寻找一个解决方案，尽量减少重新渲染的数量。我能用ParentComponent观察IntersectionObserver的孩子。
但是，我需要将这个组件转换成一个功能组件。我试图使用useRef实现相同的逻辑，但无法实现相同的结果。在observeElement中，observer.current等于null。我的功能<e
浏览 0提问于2020-04-27得票数 0
1回答
我正在将类组件转换为功能组件以供实践。它有一个ref对象来包含组件的一些变量，比如实现无限滚动的IntersectionObserver对象。
问题从这里开始。IntersectionObserver的回调函数调用组件中定义的函数(如update)来加载更多数据。因为IntersectionObserver是在useRef中定义的，所以当组件初始化时，update函数是--函数绑定。因此，updat
浏览 0提问于2021-01-07得票数 0
回答已采纳
我目前正试图在我的angularjs应用程序中使用IntersectionObserver来实现延迟加载。var app = angular.module("test", []);
return {restrict: "A",
浏览 0提问于2018-05-15得票数 0
在我的component.test.js中，我尝试通过这样的操作来模拟IntersectionObserver： observe: jest.fn(),observer.current.disconnect(); //ERROR LINE ...然而，当我运行这些测试时，我得到了TypeError: observer.current.disconnect我试着在component.test.js本身的it
浏览 0提问于2021-05-17得票数 3
回答已采纳
</div> <Projects/> <Concerts/> </div>A顶部有导航组件在单击已单击链接的样式时，更改为active。目标:将IntersectionObserver实现到我的所有部分(从Home到联系人)，并且取决于视图中的哪个组件，Scro
浏览 5提问于2022-04-03得票数 1
1回答
我正在尝试在Angular中设置IntersectionObserver，但是我不能让它工作。当我从服务器使用HttpClient向下滚动时，我想加载数据。我正在做这样的事情:在页面底部的HTML中，我有以下内容： <div #ob></div> 在.ts文件中，我使用ViewChild来获取元素并将其传递给IntersectionObserverServiceIntersectionObserverService)
浏览 12提问于2021-04-27得票数 2
回答已采纳
我有一个简单的函数，可以懒惰地加载元素： export default function lazyLoad(targets, onIntersection) {let unobserve;
obser
浏览 56提问于2020-10-01得票数 0
回答已采纳
1回答
我正在创建一个应用程序，在这个应用程序中，我需要在初始呈现时创建一个对象，并将其保存到整个组件生命周期。返回的对象将持续到组件的整个生存期。
看来我用得很好。然而，Hooks FAQ说：
// ⚠️ IntersectionObserver is created on every renderconst ref = useRef(ne
浏览 3提问于2022-05-27得票数 3
回答已采纳
如何检查用户是否在浏览器中向下滚动(或交叉)到特定元素(基于id)，以便检查条件并在角7中动态分配类名？
浏览 1提问于2019-04-20得票数 2
回答已采纳
假设我在Icon.svelte组件的/elements文件夹中。在整个应用程序中，我已经在各种其他组件中使用了图标组件。基本上认为这种方法可以提高应用程序的性能。
浏览 19提问于2022-09-22得票数 0
我正在尝试构建我的gatsby项目，但由于IntersectionObserver不被识别，我无法构建。我在InView组件中使用intersectionObserver： import React, { useRef, useState, useEffect } from 'react'
const [inView, setInView] = useState(false)
const observer = useRef(new <
浏览 22提问于2019-12-20得票数 6
回答已采纳
我正在尝试学习有关IntersectionObserver应用编程接口的各种教程，例如。将示例代码添加到我的组件的TS文件中：
observer = new IntersectionObserver
浏览 99提问于2019-06-04得票数 -2
1回答
我正在开发一个反应性应用程序，并使用以下功能来跟踪我的导航面板中的活动链接。密码能解决它的动机。这是因为使用函数changeActiveLink();的组件不在页面中(已卸载)。
我想在删除组件时删除此函数的效果。我尝试将它与DOMContentLoaded eventListener集成，然后清除该事件侦听器，但是该事件侦听器只在HTML的第一次呈现上工作，而当我们在所需的路径上呈现<
浏览 3提问于2021-03-31得票数 0
回答已采纳
我将组件的顶部侧相对于视口的to侧进行观察。其目的是在20%的组件可见时触发回调。 我在developer.mozilla.org上看到，默认情况下，API还会从根的顶部观察目标。您可以在此页面上看到一个示例：https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API 因此，我已经决定了何时80%的顶级组件将离开视口以触发回调下面是我的代码片段：
浏览 27提问于2019-05-16得票数 0
云服务器
ICP备案
腾讯会议
云直播
对象存储
腾讯云开发者
