2016-09-05 174 views
2

我想在我的流星應用程序中使用intro.js。如何在流星1.4.1.1中使用intro.js表單npm包?

import { Template } from 'meteor/templating'; 
import { ReactiveVar } from 'meteor/reactive-var'; 
// import introJs from 'intro.js'; 
var introJs = require('intro.js'); 
import './main.html'; 

.....//some code here 

Template.hello.events({ 
    'click button'(event, instance) { 
    // increment the counter when button is clicked 
    instance.counter.set(instance.counter.get() + 1); 
    }, 

'click #introjs'(e,i){ 
    console.log("call me"); 
    introJs("#introjs").start(); 
    } 
}); 

,但我給

TypeError: introJs is not a function

我該如何解決這個問題? 謝謝。

+0

我也有同樣的問題。你找到什麼了嗎? –

+1

搜索時,我得到了這個https://github.com/zhouzhuojie/meteor-introjs鏈接,看看它是否有益,也讓我知道。 –

+0

@Arjun Chaudhary不,我想找到一種方法。在流星論壇上看到你的這篇文章[link](https://forums.meteor.com/t/not-working-bootstraptour-with-meteor-1-4/28859/6) –

回答

0

在您的html文件中,您必須在任何想要介紹處理的位置添加一個介紹元素,如data-intro到您的html元素。

<template name=hello> 
    <a href='http://google.com/' class='introjsclass' data-intro='Hello step one!'></a> 
</template 

在您的js文件確保導入intro.js和intro.css

import { Template } from 'meteor/templating'; 
import { ReactiveVar } from 'meteor/reactive-var'; 
import introJs from 'intro.js'; 
//var introJs = require('intro.js'); 
// you have to import the introjs css file 
import '/node_modules/path to your introjs css file'; 
import './main.html'; 

.....//some code here 

Template.hello.events({ 


'click .introjsclass':function(event){ 
event.preventDefault(); 
    console.log('call me'); 
    introJs('.introjsclass').start(); 
    } 
}); 
+0

感謝@Vinay Prabhakaran留意你,但我給這個錯誤:TypeError:introJs不是函數 –

+0

嘗試更新的語法 –