introJs([targetElm])
data-intro 属性添加到html的元素中并调用 introJs().start():
参数:
targetElm : String (可选) 特定元素调用 introJs:,例如:#intro-tip。
let intro: any = IntroJs(document.body);
const guideRef= useRef(null);
动态的dom 绑定 ref={guideRef}
intro
.setOptions({
steps: [
{
element: '#one-step',
intro: '第一步',
position: 'right',
},
{
element: '#two-step',
intro: '第二步',
position: 'right',
},
],
nextLabel: '下一步',
prevLabel: '上一步',
doneLabel: '完成',
exitOnEsc: false,
exitOnOverlayClick: false,
showStepNumbers: true,
showBullets: false,
disableInteraction: true,
hidePrev: false,
})
.onchange((obj: any) => {
if (obj.id == 'two-step') {
intro._introItems[1].element = guideRef.current;
intro._introItems[1].position = 'right';
}
})
.oncomplete(function (step: number, reason: string) {
})
.onexit(function () {
})
.start();
浏览器回退,退出introjs
let intro: any = IntroJs(document.body);
intro.exit();