blackteay/vue-baidu-analytics
1
0
Fork 0
mirror of https://github.com/analyticsjs/vue-baidu-analytics.git synced 2025-04-23 18:00:19 +08:00
Code Issues Projects Releases Wiki Activity

backup.

Browse Source
This commit is contained in:
chengpeiquan 2021-01-07 17:57:05 +08:00
parent 91d323a89d
commit 350fb3dfd5
3 changed files with 79 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

122
demo/js/main-for-vue3.js
View File

@ -1,33 +1,14 @@
/**
* 导入需要用到的组件
*/
const { createRouter, createWebHashHistory } = VueRouter; const { createRouter, createWebHashHistory } = VueRouter;
const { createApp, defineComponent, getCurrentInstance, ref } = Vue; const { createApp, defineComponent, getCurrentInstance, ref } = Vue;
// 定义路由信息
const routes = [
{
path: '/',
redirect: '/page1'
},
{
path: '/page1',
component: {
template: '<div class="view">当前是 <strong>Page1</strong> 的路由</div>'
}
},
{
path: '/page2',
component: {
template: '<div class="view">当前是 <strong>Page2</strong> 的路由</div>'
}
},
{
path: '/page3',
component: {
template: '<div class="view">当前是 <strong>Page3</strong> 的路由</div>'
}
}
];
// 初始化路由 /**
* 初始化路由
* routes是来自 js/routes.js 里面的配置
*/
const router = createRouter({ const router = createRouter({
history: createWebHashHistory(), history: createWebHashHistory(),
routes, routes,
@ -35,39 +16,38 @@ const router = createRouter({
linkExactActiveClass: 'cur' linkExactActiveClass: 'cur'
}); });
// 初始化Vue
createApp({})
.use(router)
.use(baiduAnalytics, {
router: router,
siteIdList: [
'8dca8e2532df48ea7f1b15c714588691'
],
isDebug: true
})
.mount('#app');
const app = defineComponent({ /**
* 创建实例
*/
const app = {
setup () { setup () {
// 数据 // 插件要用到的一个代理组件
const { proxy } = getCurrentInstance();
// 初始化要用到的数据
const pageUrl = ref(''); const pageUrl = ref('');
const category = ref(''); const category = ref('');
const action = ref(''); const action = ref('');
const label = ref(''); const label = ref('');
const value = ref(''); const value = ref('');
const { proxy } = getCurrentInstance();
console.log('setup');
console.log(pageUrl);
// 提交pv的操作
const pv = () => { const pv = () => {
pushBAIDU.pv('/') proxy.$pushBAIDU.pv(pageUrl.value);
} }
const pv2 = () => { // 提交事件的操作
proxy.$pushBAIDU.pv('/2'); const event = () => {
proxy.$pushBAIDU.event(
category.value,
action.value,
label.value,
value.value
);
} }
// Vue 3.0 需要把模板要用到的东西 return 出去
return { return {
// 数据 // 数据
pageUrl, pageUrl,
@ -78,33 +58,29 @@ const app = defineComponent({
// 方法 // 方法
pv, pv,
pv2 event
} }
} }
}) };
// // 初始化Vue
// const app = new Vue({ /**
// el: '#app', * 初始化Vue
// router, */
// data () { createApp(app)
// return { // 启动路由
// pageUrl: '', .use(router)
// category: '',
// action: '', // 启动插件
// label: '', .use(baiduAnalytics, {
// value: '' router: router,
// } siteIdList: [
// }, 'aaaaaaaaaaaaaaaaaaa',
// mounted () { 'bbbbbbbbbbbbbbbbbbb',
// }, 'ccccccccccccccccccc'
// methods: { ],
// pv () { isDebug: true
// // this.$pushBAIDU.pv(this.pageUrl); })
// console.log(baiduAnalytics.pushBAIDU);
// }, // 挂载到节点上
// event () { .mount('#app');
// this.$pushBAIDU.event(this.category, this.action, this.label, this.value);
// }
// }
// });

27
demo/js/routes.js Normal file
View File

@ -0,0 +1,27 @@
/**
* 定义路由信息
*/
const routes = [
{
path: '/',
redirect: '/page1'
},
{
path: '/page1',
component: {
template: '<div class="view">当前是 <strong>Page1</strong> 的路由</div>'
}
},
{
path: '/page2',
component: {
template: '<div class="view">当前是 <strong>Page2</strong> 的路由</div>'
}
},
{
path: '/page3',
component: {
template: '<div class="view">当前是 <strong>Page3</strong> 的路由</div>'
}
}
];

5
demo/vue3.html
View File

@ -4,8 +4,8 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>[Vue3] vue baidu analytics demo</title> <title>[Vue3] vue baidu analytics demo</title>
<script src="https://unpkg.com/vue@3.0.5/dist/vue.global.js"></script> <script src="https://unpkg.com/vue@3"></script>
<script src="https://unpkg.com/vue-router@4.0.2/dist/vue-router.global.js"></script> <script src="https://unpkg.com/vue-router@4"></script>
<link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/style.css">
</head> </head>
<body> <body>
@ -55,6 +55,7 @@
</div> </div>
<script src="../dist/vue-baidu-analytics.js"></script> <script src="../dist/vue-baidu-analytics.js"></script>
<script src="js/routes.js"></script>
<script src="js/main-for-vue3.js"></script> <script src="js/main-for-vue3.js"></script>
</body> </body>