<div class="relative inline-block"> <el-input v-if="!loading" :placeholder="inputTitle" :value="downloadUrl" readonly > <template slot="append"> <el-upload action="#" accept=".zip" :show-file-list="false" :http-request="httpRequest" > <span>点击上传</span> </el-upload> </template> </el-input> <div v-if="loading" style="display: flex; align-items: center"> <el-progress class="w-80" stroke-linecap="butt" :stroke-width="20" :width="40" :text-inside="true" :percentage="percentage" /> <el-button type="text" icon="el-icon-circle-close" @click="abortUpload()" /> </div> <el-alert v-if="uploadError" class="w-100" title="上传失败，请重新上传" type="error" show-icon /> </div>这段代码如何兼容手动输入

您可以在 el-input 组件上添加一个 @change 事件监听器，然后在事件处理函数中获取到手动输入的值并将其赋值给 downloadUrl 变量。示例代码如下：

<el-input v-if="!loading" :placeholder="inputTitle" :value="downloadUrl" readonly @change="handleInputChange"> 
  <template slot="append"> 
    <el-upload action="#" accept=".zip" :show-file-list="false" :http-request="httpRequest"> 
      <span>点击上传</span> 
    </el-upload> 
  </template> 
</el-input>

methods: {
  handleInputChange(event) {
    this.downloadUrl = event.target.value;
  },
  // 其他方法...
}

这样，当用户手动输入时，downloadUrl 变量会被更新，上传时也会使用最新的值。