- 使用 yarn add amplitude-js 或者 npm amplitude-js --save 將依賴包添加到項(xiàng)目中
- 在mian.js中導(dǎo)入
import Amplitude from "./plugins/amplitude";
Vue.use(Amplitude, {
apiKey: process.env.VUE_APP_AMPLITUDE_API_KEY,
userId: userInfo?.id
});
APIkey 可以點(diǎn)開 amplitude 的settings 里的Projects 中點(diǎn)擊想要買埋點(diǎn)的項(xiàng)目中去復(fù)制過來省撑,后面的userId是用戶的ID炼蛤,唯一標(biāo)識(shí)
下面就可以在項(xiàng)目中進(jìn)行埋點(diǎn)了耳峦,埋點(diǎn)一般使用的多的就是logEvent 和setUserProperties,來進(jìn)行一般事件的埋點(diǎn)和用戶屬性的埋點(diǎn) 响蕴,更多事件可以點(diǎn)擊https://amplitude.github.io/Amplitude-JavaScript/Amplitude
this.$amplitude.getInstance().logEvent('Clicked Homepage Button', {'finished_flow': false, 'clicks': 15});
this.$amplitude.getInstance().setUserProperties({'gender': 'female', 'sign_up_complete': true});
埋點(diǎn)成功后在項(xiàng)目運(yùn)行后,在瀏覽器可以看到有一個(gè)amplitude的請(qǐng)求發(fā)出拉岁,在amplitude網(wǎng)頁中的user look-up 可以看到埋點(diǎn)出現(xiàn)的信息坷剧,如下圖:
image.png