vue 文字自动滚动

最新推荐文章于 2024-05-15 22:50:31 发布

VIP文章举头三尺有神农

最新推荐文章于 2024-05-15 22:50:31 发布

阅读量1k

点赞数

分类专栏： js 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/M__Yang_/article/details/126162087

版权

子组件：

<template>
  <div
    class="m-slide"
    :style="`height: ${height}px; width: ${totalWidth}px;`"
    @mouseenter="onStop"
    @mouseleave="onStart"
  >
    <div
      :style="`will-change: transform; transform: translateX(${-left}px); line-height: ${height}px; width: ${
        width - 20
      }px;`"
      class="u-slide-title"
      v-for="(item, index) in sliderData"
      :key="index"
      :title="item.title"
      @click="onClickTitle(item.title)"
    >
      {
  { item.title }}
    </div>
  </div>
</template>
<script>
export default {
  name: "Slider",
  props: {
    sliderData: {
      type: Array,
      required: true,
      default: () => {
        return [];
      },
    },
    totalWidth: {
      type: Number