取消渲染()v3.3.44

🌐 cancelRender()v3.3.44

调用此函数时，Remotion 将停止当前渲染，并且不会进行任何重试。

🌐 By invoking this function, Remotion will stop the current render, and not perform any retries.

将 string 或 Error（用于获得最佳堆栈跟踪）传递给 cancelRender()，这样当渲染失败时你可以识别错误。如果传递了 string，它将被转换为一个 Error 对象。

🌐 Pass a string or an Error (for best stack traces) to cancelRender() so you can identify the error when your render failed.
If a string is passed, it will be turned into an Error object.

它 throw 是错误，所以它之后的任何代码都不会被执行。
你可能需要捕获它以避免未处理的错误。

cancelRender() 可以从 remotion 包中导入，但更推荐使用 useDelayRender()（从 v3.0.374 开始）的 hook，因为它可以使你的代码对浏览器渲染具有前瞻性兼容性。

示例

🌐 Example

MyComposition.tsx
import React, {useEffect, useState} from 'react';
import {useDelayRender} from 'remotion';

export const MyComp: React.FC = () => {
  const {delayRender, continueRender, cancelRender} = useDelayRender();
  const [handle] = useState(() => delayRender('Fetching data...'));

  useEffect(() => {
    fetch('https://example.com')
      .then(() => {
        continueRender(handle);
      })
      .catch((err) => {
        cancelRender(err);
      });
  }, []);

  return null;
};

⚠️ Discouraged - global APIs
import {useEffect, useState} from 'react';
import {delayRender, continueRender, cancelRender} from 'remotion';

const MyComp: React.FC = () => {
  const [handle] = useState(() => delayRender('Fetching data...'));

  useEffect(() => {
    fetch('https://example.com')
      .then(() => {
        continueRender(handle);
      })
      .catch((err) => {
        cancelRender(err);
      });
  }, []);

  return <div>My component</div>;
};

`cancelRender()` 抛出一个错误

🌐 cancelRender() throws an error

cancelRender() 也会抛出错误，所以它之后的任何代码都不会被执行。

在客户端渲染中，这不会被renderMediaOnWeb()或renderStillOnWeb()捕获，并且是一个未处理的错误。将cancelRender()封装在try/catch块中以避免此问题：

🌐 In client-side rendering, this is not caught by renderMediaOnWeb() or renderStillOnWeb() and is an unhandled error.
Wrap cancelRender() in a try/catch block to avoid this:

✅ Best practice - wrap cancelRender() in a try/catch block
import {useDelayRender} from 'remotion';

const {cancelRender} = useDelayRender();

try {
  cancelRender(new Error('This throws an error'));
} catch {
  // Ignore the resulting error
}

兼容性

🌐 Compatibility

Servers			Environments
Node.js	Bun	Serverless Functions	Client-side rendering	Server-side rendering	Player	Studio
					Throws error	Throws error

另请参阅

🌐 See also

示例​

cancelRender() 抛出一个错误​

兼容性​

另请参阅​

示例

`cancelRender()` 抛出一个错误

兼容性

另请参阅