Javascript JS没有在盖茨比身上运行

我正在尝试盖茨比第一次建立一个博客。我在用这个做基地

我想添加一些javascript来设置一些文本的动画，作为一个快速测试，我已将以下内容添加到我的html.js文件中：

我认为这是因为JS试图在Bio.JS完成之前运行。。但是我如何告诉JS等待呢？如果我尝试在Bio.JS文件中包含JS，它将无法编译

---

添加document.addEventListenerDOMContentLoaded，functionevent{也没有帮助。

应该不需要像使用document.getElementById'bio\uu subtext'一样在DOM中选择任何内容

您可以在组件中需要变量的地方声明变量，或者通过一个来自更高上下文（页面或其他组件）的道具传递到组件中

类。组件{ 渲染{ const name='Natalie' 常量短语=[ “Cowabunga”， “现在是忍者时代”， “布亚卡莎” ] 回来 嗨，我是{name}！ 我最喜欢的一些短语是： {PHASES.MAPPHASE=>{PHASE} }

---

}只是一个提示const el应该是let el或var el。修改常量并不正确。你到底想达到什么目的？@ksav目前，我只是想替换bio_uu子文本中的文本。最终，我将在一系列短语中循环并在阶段之间设置动画。@ksav如何？我尝试的一切似乎都会导致编译错误…我意思是说：在Bio中，你可以在渲染函数的返回语句之前添加一些javascript：谢谢你；但是我想在短语之间设置动画，而不是仅仅打印出来。类似于这样的内容：好的，但我认为你需要先走一走，然后才能运行。了解构建应用程序和传递数据的基础知识在这里询问关于stackoverflow的另一个更具体的问题之前，我先声明我的短语，然后将它们传递到JS？@Natalie官方的react教程是一个很好的资源，关于状态和生命周期的部分将是您感兴趣的，您可以创建一组短语并将它们传递到TextScrambler组件。使用在该组件中，您可以通过道具访问数组，然后您可以在该组件中编写文本置乱逻辑。

<script
      dangerouslySetInnerHTML={{
        __html: `
                var name = 'world';
                console.log('Hello ' + name);

                console.log('hey');

                const phrases = [
                    'aaa',
                    'bbb',
                    'ccc'
                ];

                const el = document.getElementById('bio__subtext');

                el.innerHTML = 'hi';

            `,
      }}
    />

class Bio extends React.Component {
  render() {
    return (
      <div id="bio">
        <div className="bio_wrapper">
            <img
              src={profilePic}
              alt={'NdW'}
            />
            <p>
              Hi, I'm Natalie!<br />
              I <span id="bio__subtext"></span><br/>
              <span className="about_button"><a href="/">Find out more</a></span>
              <a href="#" target="_blank">GH</a>
              <a href="#" target="_blank">TW</a>
            </p>
        </div>
      </div>
    )
  }
}