1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
| <template>
| <div class="banner-comp">
| <div class="swiper-container" ref="swiper-container">
| <div class="swiper-wrapper">
| <div class="swiper-slide" v-for="(item,index) in bannerList" :key="index">
| <div class="item">
| <img class="banner-bg" :src="item.url" alt="">
| <div v-if="item.flag === 1" class="content">
| <h3 class="yjqd">
| 一键启动FUNASR
| </h3>
| <p class="text">
| FUNASR希望在语音识别的学术研究和工业应用之间架起一座桥梁。通过发布工业级<br />
| 语音识别模型的训练和微调，研究人员和开发人员可以更方便地进行语音识别模型的<br />
| 研究和生产，并推动语音识别生态的发展。让语音识别更有趣！
| </p>
|
| <div class="lxwm">
| 联系我们
| </div>
| </div>
| </div>
| </div>
| </div>
|
| <div class="swiper-pagination"></div>
| </div>
| </div>
| </template>
|
| <script>
| import Swiper from 'swiper'
| export default {
| name: 'banner-comp',
| data () {
| return {
| bannerList: [
| {
| flag: 1,
| url: require('./assets/images/banner.png')
| },
| {
| flag: 2,
| url: require('./assets/images/banner.png')
| },
| {
| flag: 2,
| url: require('./assets/images/banner.png')
| },
| {
| flag: 2,
| url: require('./assets/images/banner.png')
| },
| {
| flag: 2,
| url: require('./assets/images/banner.png')
| }
| ],
| swiperObj: null
| }
| },
| mounted () {
| this.$nextTick(() => {
| this.initSwiper()
| })
| },
| methods: {
| initSwiper () {
| if (this.swiperObj) {
| this.swiperObj.destroy()
| }
| // const that = this
| this.swiperObj = new Swiper(this.$refs['swiper-container'], {
| slidesPerView: 1,
| direction: 'vertical',
| pagination: {
| el: '.swiper-pagination',
| dynamicBullets: true
| },
| on: {
| slideChangeTransitionEnd: function () {
|
| },
| init: function () {
|
| }
| }
| })
| }
| }
| }
| </script>
| <style src="./assets/css/banner.scss" lang="scss"></style>
|
|
