跳至主要內容
IntersectionObserver

IntersectionObserver

IntersectionObserver 提供了一种异步监听目标元素是否出现在视口的方法,它可以用于判断元素是否可见,从而执行相应的操作。

基本用法

创建 IntersectionObserver 对象

要使用 IntersectionObserver,首先需要创建一个 IntersectionObserver 对象,然后使用该对象来监听目标元素。当目标元素出现在视口或者达到一定阈值时,会触发回调函数,从而执行相应的操作。

const observer = new IntersectionObserver(callback, options);

Yuchen大约 4 分钟JSJSVue
取消 Promise

取消 Promise

fetch 和 axios 都支持使用AbortController的方式来取消请求。以 fetch 为例,想要取消请求,分为三步:

const url = "https://blog.yuchen.tech/";

// 1. 创建AbortController
const controller = new AbortController();
const signal = controller.signal;

// 2. 发送请求时传入AbortController的signal
fetch(url, { signal })
  .then((response) => {
    console.log(response);
  })
  .catch((error) => {
    console.log(error);
  });

// 3. 使用AbortController的abort方法来取消请求
controller.abort();
// Node 下输出
// DOMException [AbortError]: This operation was aborted
// 浏览器下输出
// DOMException: The user aborted a request.

Yuchen大约 2 分钟JSJSTSSnippets