小编und*_*ind的帖子

我在 Next.js 中使用打字机效果库，但它导致了此错误：

错误：水合失败，因为初始 UI 与服务器上呈现的内容不匹配。

我按照文档中的说明修复了尝试在组件呈现时通过 useEffect 在状态中添加打字机的错误，但它不起作用。我不明白为什么会导致这个错误。

我的代码：//TypeEffect.tsx

import Typewriter from 'typewriter-effect';

const TypeEffect = () => {
  const strings = [
    'modern & innovative digital solutions.',
    'e-commerces, web systems, landing pages, blogs & much more.',
    'front-end & back-end development.',
    'UX &UI best pratices.',
  ];

  return (
    <Typewriter
      options={{
        autoStart: true,
        loop: true,
      }}
      onInit={(typewriter) => {
        typewriter
          .typeString(strings[0])
          .pauseFor(4000)
          .deleteAll()
          .pauseFor(2000)
          .typeString(strings[1])
          .pauseFor(4000)
          .deleteAll()
          .pauseFor(2000)
          .typeString(strings[2])
          .pauseFor(4000)
          .deleteAll()
          .pauseFor(2000)
          .typeString(strings[3])
          .pauseFor(4000)
          .deleteAll()
          .pauseFor(2000)
          .start();
      }} …