2

我试图通过 vue-intro.js 绑定使用 intro.js，为我的用户创建一个能够浏览应用程序中不同路线的入职流程。

vue 绑定https://github.com/alex-oleshkevich/vue-introjs intro.js 文档https://introjs.com/docs/intro/api/

我已经能够使用 v-directives 让它工作，但我想通过编程导航跨越多条路线来实现结果。

我还尝试了不同的方法来选择元素，例如查询选择器，但无济于事。尝试了安装/创建的各种组合。

this.$intro().addStep({
    element: '#one',
    intro: "step one",
    position: 'right',
})

this.$intro().addStep({
    element: '#two',
    intro: "step two",
    position: 'bottom'
})

this.$intro().start().oncomplete(() =>
    this.$route.push("someroute")

)

我希望能够浏览这些步骤，并且当它们更改时触发 oncomplete(() => 回调)，以便能够导航到不同的 vue 页面并继续执行入职流程。

4

1 回答 1

0

我可以说一件事，IntroJS 对 currentDOM 类名很敏感。一旦他们找不到特定元素（假设您的 DOM 在 vue 中渲染较晚），introJS 将无法正常工作。我认为您可以尝试通过使用 introJS 中的“data-intro”或“data-title”道具直接将消息绑定到 HTML 来以其他方式编写它。查看他们的示例 Hello-world 项目 --> https://introjs.com/docs/examples/basic/hello-world

谢谢

于 2021-05-17T09:07:06.837 回答