Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Vue typer repeats when view is shown on completion #7

Closed
barnholdy opened this issue May 22, 2017 · 3 comments
Closed

Vue typer repeats when view is shown on completion #7

barnholdy opened this issue May 22, 2017 · 3 comments
Labels

Comments

@barnholdy
Copy link

The following code types the two texts twice, but is expected to do it only once. Any ideas?

<template>
  <div>
    <vue-typer
    :text='["Text 1", "Text 2"]'
    :type-delay='110'
    :repeat='0'
    @completed='onComplete()'>
    </vue-typer>
    <div v-show="showRest">
      Rest...
    </div>
  </div>
</template>

<script>
import { VueTyper } from 'vue-typer'
export default {
  name: 'hello',
  components: {
    VueTyper
  },
  data: function () {
    return {
      showRest: false
    }
  },
  methods: {
    onComplete: function () {
      this.showRest = true
    }
  }
}
</script>
@cngu
Copy link
Owner

cngu commented May 22, 2017

I cannot reproduce this issue. Can you provide a fiddle/pen/test repo?

It is expected to type the contents of the "text" array once. So "Text 1" and "Text 2" are typed once.

  1. "Text 1" is typed
  2. "Text 1" is erased
  3. "Text 2" is typed
  4. Cursor stops animating
  5. onComplete is called

@barnholdy
Copy link
Author

Hey,

thanks for your quick reply. Yes, the expected behaviour is as you described it. But it seem that when I do DOM manipulations in the onComplete the typer runs again. See your self:
https://jsfiddle.net/v443yj46/2/

@cngu
Copy link
Owner

cngu commented May 30, 2017

Thanks for the fiddle! I'll try to fix this by next week (likely during the weekend).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants