在自己做一個(gè)簡(jiǎn)單的后臺(tái)管理系統(tǒng)時(shí)，用的是node作本地?cái)?shù)據(jù)庫(kù)，然后用了Element-ui的upload組件來(lái)實(shí)現(xiàn)圖片的上傳，中間有遇到那么點(diǎn)小坑，這里記錄下，比較坑的一點(diǎn)就是，不知道文件的命名不能帶空格，然后改了好久

創(chuàng)新互聯(lián)公司長(zhǎng)期為上1000家客戶提供的網(wǎng)站建設(shè)服務(wù)，團(tuán)隊(duì)從業(yè)經(jīng)驗(yàn)10年，關(guān)注不同地域、不同群體，并針對(duì)不同對(duì)象提供差異化的產(chǎn)品和服務(wù)；打造開(kāi)放共贏平臺(tái)，與合作伙伴共同營(yíng)造健康的互聯(lián)網(wǎng)生態(tài)環(huán)境。為昌黎企業(yè)提供專業(yè)的做網(wǎng)站、成都網(wǎng)站設(shè)計(jì)，昌黎網(wǎng)站改版等技術(shù)服務(wù)。擁有10余年豐富建站經(jīng)驗(yàn)和眾多成功案例,為您定制開(kāi)發(fā)。

1.index.vue文件

這里的話，就是簡(jiǎn)單點(diǎn)的使用圖形界面框架Element-ui的上傳組件，然后，action就是服務(wù)器端的地址，我這里使用了代理，將localhost:8080代理到你使用node作為服務(wù)器的地址就可以了

<template>
  <div class="avatar">
   <img
    :src="avatar?avatar:defaultImg"
   />
  </div>
  <el-upload
   class="upload-demo"
   drag
   action="http://localhost:8080/api/upload"
   :show-file-list="false"
   :on-success="uploadImgSuccess"
  >
   <i class="el-icon-upload"></i>
   <div class="el-upload__text">將文件拖到此處，或<em>點(diǎn)擊上傳</em></div>
  </el-upload>
</template>
<script>
import defaultImg from '@/assets/img/avatar.png'
export default{
  data() {
    return {
      avatar: ''
    }
  },
  methods: {
    uploadImgSuccess(res) {
      this.avatar = res.result.url;
    }
  }
}
</script>

網(wǎng)頁(yè)名稱：node之本地服務(wù)器圖片上傳的方法示例-創(chuàng)新互聯(lián)
新聞來(lái)源：http://www.chinadenli.net/article36/dccisg.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供靜態(tài)網(wǎng)站、商城網(wǎng)站、網(wǎng)站策劃、外貿(mào)建站、小程序開(kāi)發(fā)、網(wǎng)站設(shè)計(jì)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)