uniapp télécharge des images de ressources statiques et les utilise (pratique)

Tout d'abord, expliquez pourquoi vous souhaitez faire cela, principalement en raison des besoins de l'entreprise, par exemple :

Quand uniapp transfère vers un petit programme, vous devriez toujours rencontrer un problème qui est la sous-traitance. C'est une règle rigide du petit programme. Comme la sous-traitance implique plus de choses, parce qu'il faut tenir compte de la taille du paquet, le petit programme est stipulé que il ne doit pas dépasser 2 Mo. , le package principal n'est pas autorisé à référencer des ressources de sous-package. . .

À ce stade, nous ferons de notre mieux pour réduire certaines ressources inutiles dans le package principal, telles que le serveur de téléchargement d'images pour référence.

étape 1:

<view class="solids" @tap="ChooseImage" v-if="imgList.length<4">
	<text class='cuIcon-cameraadd'>上传</text>
</view>

<script>
	ChooseImage() {
		const _this = this
		uni.chooseImage({
			count: 4, //默认9
			sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
			sourceType: ['album'], //从相册选择
			success: (res) => {
			const tempFilePaths = res.tempFilePaths;
			const uploadTask = uni.uploadFile({// 这里是重点
			url: '后端提供服务器的接口地址',
			filePath: tempFilePaths[0],//选择图片的path
			name: 'file', //图片的名字
			data: {}, //需要传递的参数
			header: {AccessToken: "登录后端返回的Token,这里记住参数的数据类型"},
			success: (uploadFileRes) => {//如果code等于200说明ok了
				_this.imgList = [..._this.imgList, uploadFileRes.data]
			    }
			});
		  }
		});
	},
</script>

Sortez les images qui doivent être téléchargées sur le serveur

Étape 2:

image de devis

Nous montons d'abord la méthode globale dans le fichier main.js

Vue.prototype.imageURL = function(img){// 这里的img是形参
    return 'https://www.baidu.com后端的图片接口地址'+img
}

Ensuite, nous devons nous référer à l'image où

<image :src="imageURL('传递后端的图片名')"></image>

De cette façon, nous pouvons référencer l'image sur le serveur

Je suppose que tu aimes

Origine blog.csdn.net/weixin_64974600/article/details/122238176
conseillé
Classement