VUE_타이핑 효과 사용하기

텍스트를 타이핑 하는듯하게 띄워보자.

Script 부분

<script>
   export default{
   setup(){
   let typedText= ref('')
   let txt = '타이핑 효과로 글자가 나타납니다.';
   let i = 0;
   const ViewText=()=> {
     if (i < txt.value.length) {
       typedText.value+= txt.charAt(i);
       i++;
       setTimeout(ViewText, 100);
     }
   onMounted(() => {
     ViewText()
   })
   return{
     typedText
     }
    }
   }
</scrip>

Template 부분

<span>{{typedText}}</span>

이렇게 사용하면 됨.

---끗---