用vue写一个时间线上上传文件的代码

可以的，以下是一个简单的时间线上传文件的 Vue 代码示例：

<template>
<div>
<h2>上传文件时间线</h2>
<div class="timeline">
<div class="timeline-item" v-for="(file, index) in files" :key="index">
<div class="timeline-item-header">
<h3>{{ file.name }}</h3>
<span>{{ file.date }}</span>
</div>
<div class="timeline-item-body">
<p>{{ file.description }}</p>
<input type="file" @change="uploadFile(index, $event)" />
<button @click="deleteFile(index)">删除</button>
</div>
</div>
</div>
</div>
</template>

<script>
export default {
data() {
return {
files: [
{
name: "文件1",
date: "2022-01-01",
description: "这是文件1的描述",
file: null,
},
{
name: "文件2",
date: "2022-01-02",
description: "这是文件2的描述",
file: null,
},
],
};
},
methods: {
uploadFile(index, event) {
this.files[index].file = event.target.files[0];
},
deleteFile(index) {
this.files.splice(index, 1);
},
},
};
</script>

<style>
.timeline {
margin: 0;
padding: 0;
}

.timeline-item {
display: flex;
flex-direction: row;
margin-bottom: 20px;
}

.timeline-item-header {
flex: 1;
}

.timeline-item-body {
flex: 3;
}
</style>