如何在Vue.js中使用typescript for materialize.css - tabs？

Question

这是我关于堆栈的第一个问题，我希望每个人都可以使用它： 我想在Vue.js中使用materialze-design Tabs。我实现了typescript，知道引导我解决我无法正确使用文档的问题。 这是文档：https://materializecss.com/tabs.html。 我得到了以下模板：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<input type="text" id="input-product-key" maxlength="29" style="width:50%">

这就是如何根据文档使用普通的Javascript：

<template>
  <div class="row">
    <div class="col s12">
      <ul class="tabs">
        <li class="tab col s3"><a href="#test1">Test 1</a></li>
        <li class="tab col s3"><a href="#test2">Test 2</a></li>
        <li class="tab col s3 "><a href="#test3">Test 3</a></li>
      </ul>
    </div>
    <div id="test1" class="col s12">Test 1</div>
    <div id="test2" class="col s12">Test 2</div>
    <div id="test3" class="col s12">Test 3</div>
  </div>
</template>

我不知道如何使用TypeScript来制作动画。 有人可以帮我吗？