vue跑马灯vue3-marquee
- 安装vue3-marquee
如果您使用的是 npm:
npm install vue3-marquee@latest --save
如果您使用的是yarn:
yarn add vue3-marquee@latest
- 用法
最常见的用例是全局注册组件。
// main.js
import { createApp } from 'vue'
import Vue3Marquee from 'vue3-marquee'
import 'vue3-marquee/dist/style.css'
createApp(App).use(Vue3Marquee).mount('#app')
或者,您可以在本地导入选取框组件。
import { Vue3Marquee } from 'vue3-marquee'
import 'vue3-marquee/dist/style.css'
export default {
components: {
Vue3Marquee,
},
}
然后,您可以在模板中使用该组件。一个常见的用例是用于徽标的图像选取框,但您也可以使用它来滚动文本。
<template>
<Vue3Marquee>
<img height="200" width="300" src="...img" />
<img height="200" width="300" src="...img" />
<img height="200" width="300" src="...img" />
</Vue3Marquee>
</template>
<script>
import { Vue3Marquee } from 'vue3-marquee'
import 'vue3-marquee/dist/style.css'
export default {
components: {
Vue3Marquee,
},
}
</script>