Comment obtenir l'index lorsque elementui et el-upload sont utilisés dans v-for

Cet article présente principalement comment obtenir un index lorsque elementui et el-upload sont utilisés dans v-for. Il a une certaine valeur de référence. Maintenant, je le partage avec vous. Les amis dans le besoin peuvent s'y référer

<div v-for = &#39;item in list&#39;>
　　<div @click="getImageTypeIndex(index)">
                      <el-upload
                        class="upload-demo"
                        drag
                        :action="uploadUrl"
                        :headers = "{token : userToken}" //带用户token
                        :on-success="getImageSuccess"  //上传成功
                        :before-upload="beforeAvatarUpload"
                        :show-file-list = "false"
                        :on-error = "getImageError"
                      >　　　　　　　　　　　　　　　//若上传失败，可继续拖拽
                        <div v-show="!item.imageUrl">
                          <i class="el-icon-upload"></i>
                          <p class="c8492A6 f14 upload-p">点击或拖拽 上传<span class="cFF8400">图片</span></p>
                          <p class="c8492A6 f12 upload-p">只能上传 jpg/png 文件，且不超过500kb</p>
                        </div>　　　　　　　　　　　　　　　//若上传成功，展示图片
                        <img v-show="item.imageUrl" :src="imgUrl + &#39;?fileId=&#39; + item.imageUrl + &#39;&token=&#39; + userToken" alt="" height="180">
                      </el-upload>
                    </div>
</div>

.

//      获取当前index
getImageTypeIndex:function (index) {this.uploadImageType = index  //先在data里定义下，此处省略定义},



 //      图片上传成功
getImageSuccess:function (res, file) {
        this.$message({
          message: '上传成功！',
          type: 'success'
        });
　　　　　this.list[this.uploadImageIndex].imageUrl = res.data.fileId   //我这里是list里有 imageUrl 来存储图片id,展示的地方根据id自己拼url
 },

Remarque : La méthode getImageSuccess d'el-upload ne prend actuellement pas en charge d'autres paramètres, donc afin d'obtenir l'index de la liste, vous pouvez utiliser la méthode ci-dessus pour obtenir l'index en plaçant un p dans la couche externe d'el-upload, puis utilisez la méthode getImageSuccess Les opérations sur les données sont effectuées en fonction de l'index.

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'étude de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Lancer à plat de sphères et effets de transformation dynamique des couleurs obtenus avec jQuery et Canvas

Basé sur le format JSON data Introduction au plug-in simple de diaporama jQuery (jquery-slider)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!