<script setup>
const props = defineProps({
  style: Object,
  titleData: Array
})
</script>

<template>
  <div>
    <template v-for="(title, index) in props.titleData" :key="index">
      <div class='title-config title-range' :style="{ left: props.style.width * index }">
        {{ title }}
      </div>
    </template>
  </div>
</template>

<style scoped>
.title-range {
  left: 0;
  top: 0;
  width: v-bind('style.width');
  height: 20;
}
</style>
<style>
/* css文件要单独放到没有scoped设置的style标签中，规避css属性redefine的warning */
@import "./FontConfig.css";
</style>