如何在 Svelte 中使用 TypeitJs？答案

【问题标题】：How to use TypeitJs with Svelte?如何在 Svelte 中使用 TypeitJs？
【发布时间】：2019-11-13 11:08:39
【问题描述】：

 <script>
  import TypeIt from "typeit";
  export let name;

  new TypeIt('#simpleUsage', {
  strings: 'This is a simple string.',
  speed: 50,
  waitUntilVisible: true
}).go();

</script>

<style>
  h1 {
    color: purple;
  }
</style>

<h1>
  Hello
  <span id="name"></span>
</h1>
<p id="simpleUsage"></p>

我成功导入了 typeit npm 模块，没有错误登录到控制台，但仍然无法正常工作。

我已经尝试过 webpack 和 rollup 了。

我知道我说的很具体，但有人可以在这里帮助我吗？我是苗条的新手，没有任何错误登录到控制台，很难找到问题。

【问题讨论】：

标签： svelte

【解决方案1】：

<script> 中的代码在您的标记被渲染之前运行（否则，如果您的标记中有任何逻辑，Svelte 将不知道要渲染什么）。正因为如此，你不能在之后引用 DOM 节点。 onMount 函数就是因为这个原因而存在的：https://svelte.dev/tutorial/onmount

最好使用对 DOM 节点的引用而不是 id 属性（不能保证是唯一的——如果你有这个组件的两个实例，你会有重复的 ID）。见https://svelte.dev/tutorial/bind-this。

【讨论】：