使用vue2.0写一个文件上传事件

您好，以下是使用 Vue2. 编写文件上传事件的示例代码：

<template>
<div>
<input type="file" @change="handleFileUpload">
</div>
</template>

<script>
export default {
methods: {
handleFileUpload(event) {
const file = event.target.files[];
const formData = new FormData();
formData.append('file', file);
// 发送文件到服务器
// ...
}
}
}
</script>

以上代码中，我们使用了 input 标签来让用户选择文件，然后在 handleFileUpload 方法中获取到用户选择的文件，并将其封装成 FormData 对象，最后发送到服务器即可。当然，具体的发送方式需要根据实际情况来确定。

相关问题

vue2.0 实现多文件上传 代码演示

以下是一个简单的 Vue 2.0 组件示例，用于多文件上传：

<template>
  <div>
    <form>
      <input type="file" ref="files" multiple @change="handleFilesUpload" />
      <button type="submit" @click.prevent="uploadFiles">上传</button>
    </form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      files: [],
    };
  },
  methods: {
    handleFilesUpload() {
      this.files = this.$refs.files.files;
    },
    uploadFiles() {
      const formData = new FormData();
      for (let i = 0; i < this.files.length; i++) {
        const file = this.files[i];
        formData.append("files[]", file);
      }
      // 发送请求，上传文件
      // axios.post('/upload', formData) ...
    },
  },
};
</script>

这个组件包含一个文件 input，用户可以通过它选择多个文件。当用户选择文件时，我们将文件存储在 `files` 数组中。当用户点击上传按钮时，我们使用 `FormData` 将文件发送到服务器。

请注意，这个示例仅说明了如何实现多文件上传，实际应用中还需要在服务器端进行文件处理和验证。

用vue-cli2.0版本写一个商城购物系统

好的，以下是用 vue-cli2.0 版本搭建一个简单的商城购物系统的步骤：

1. 安装 vue-cli2.0 脚手架工具

首先需要安装 vue-cli2.0 脚手架工具，可以使用 npm 安装：

npm install -g vue-cli@2.0

2. 创建项目

在命令行中执行以下命令创建一个新的 vue 项目：

vue init webpack my-shop

其中，`my-shop` 是项目名称，可以自行修改。

3. 安装依赖

进入项目目录，执行以下命令安装项目依赖：

cd my-shop
npm install

4. 编写代码

在 `src` 目录下编写代码，可以按照以下结构组织代码：

- src
  - api            // 接口请求模块
  - assets         // 静态资源
  - components     // 组件
  - router         // 路由
  - store          // 状态管理
  - views          // 页面视图
  - App.vue        // 根组件
  - main.js        // 入口文件

在组件和页面视图中可以使用 Element UI 或其他 UI 框架来搭建界面，使用 axios 或其他库来请求接口数据。

5. 打包和部署

在开发完成后，可以执行以下命令打包项目：

npm run build

打包完成后，将 `dist` 目录下的文件上传到服务器即可部署应用。

以上就是用 vue-cli2.0 版本搭建一个简单的商城购物系统的步骤。