<input type="file" id="upload" /> <button id="test" onclick="upload()">上传</button> var file = $('#upload')[0].files[0]; 修改为vue3中的ts格式，不使用jq

在Vue3中使用TypeScript和不使用jQuery，可以使用以下代码实现相同的功能：

HTML模板：

<template>
  <div>
    <input type="file" ref="fileInput" @change="onFileChange" />
    <button @click="upload">上传</button>
  </div>
</template>

组件代码：

<script lang="ts">
import { defineComponent, ref } from 'vue';

export default defineComponent({
  setup() {
    const fileInput = ref(null);
    const file = ref(null);

    const onFileChange = (event: Event) => {
      const files = (event.target as HTMLInputElement).files;
      if (files && files.length > 0) {
        file.value = files[0];
      }
    };

    const upload = () => {
      // 在这里实现上传文件的逻辑
      console.log(file.value);
    };

    return {
      fileInput,
      file,
      onFileChange,
      upload,
    };
  },
});
</script>

在这里，我们使用了Vue3中的`ref`函数来引用DOM元素，不再使用jQuery。我们使用`onFileChange`函数来监听文件选择事件，将选择的文件存储在`file`变量中。最后，我们在`upload`函数中实现上传文件的逻辑。