el-timeline 动态改变样式

el-timeline 的样式可以通过修改组件的 class 来进行动态改变。

比如，可以通过以下代码动态改变 el-timeline 的背景颜色：

<template>
  <el-timeline :class="timelineClass" v-model="timelineData">
    <el-timeline-item
      v-for="(item, index) in timelineData"
      :key="index"
      :timestamp="item.time"
    >
      {{ item.title }}
    </el-timeline-item>
  </el-timeline>
</template>

<script>
export default {
  data() {
    return {
      timelineData: [
        {
          time: '2021-01-01',
          title: '2021年'
        },
        {
          time: '2021-02-01',
          title: '2021年2月'
        },
        {
          time: '2021-03-01',
          title: '2021年3月'
        }
      ],
      timelineClass: 'timeline-bg-color'
    }
  },
  methods: {
    changeTimelineStyle() {
      // 动态改变 el-timeline 的样式
      this.timelineClass = 'timeline-new-bg-color'
    }
  }
}
</script>

<style>
.timeline-bg-color {
  background-color: #f0f0f0;
}

.timeline-new-bg-color {
  background-color: #e0e0e0;
}
</style>

在上面的代码中，`timelineClass` 属性用来绑定 el-timeline 的 class，通过改变 `timelineClass` 属性的值，可以动态改变 el-timeline 的样式。可以在需要改变样式的时候调用 `changeTimelineStyle` 方法来修改样式。需要注意的是，在样式表中需要定义好不同 class 对应的样式。