37 lines
866 B
Vue
37 lines
866 B
Vue
|
<template>
|
||
|
<div class="app-container">
|
||
|
<aside>
|
||
|
The guide page is useful for some people who entered the project for the first time. You can briefly introduce the
|
||
|
features of the project. Demo is based on
|
||
|
<a href="https://github.com/kamranahmedse/driver.js" target="_blank">driver.js.</a>
|
||
|
</aside>
|
||
|
<el-button icon="el-icon-question" type="primary" @click.prevent.stop="guide">
|
||
|
Show Guide
|
||
|
</el-button>
|
||
|
</div>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
import Driver from 'driver.js' // import driver.js
|
||
|
import 'driver.js/dist/driver.min.css' // import driver.js css
|
||
|
import steps from './steps'
|
||
|
|
||
|
export default {
|
||
|
name: 'Guide',
|
||
|
data() {
|
||
|
return {
|
||
|
driver: null
|
||
|
}
|
||
|
},
|
||
|
mounted() {
|
||
|
this.driver = new Driver()
|
||
|
},
|
||
|
methods: {
|
||
|
guide() {
|
||
|
this.driver.defineSteps(steps)
|
||
|
this.driver.start()
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|