maishidaSJ/pages/UserCenter/mendian/BigimageView.vue

<template>
	<view style="width: 100%;height: 100%;">
		<movable-area class="zoomablev" :scale-area="true">
			<movable-view class="map-show-wrap" scale='true' direction='all' out-of-bounds='true' scale-max='2'>
				<view style="width:100vw;height: 100vh;">
					<image style="width:100%;height: 100%;" :src="compleurl(mysrc)" mode="aspectFit"></image>
				</view>
			</movable-view>
		</movable-area>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mysrc: '',
				baseUrl:'https://backend.cityexpress168.com.vn/prod-api',
			}
		},
		onLoad(option) {
			this.mysrc = option.mysrc;
		},
		methods: {
			compleurl(url){
				//console.log('------compleurl',url)
				if(!url){
					return '';
				}
				if(url.length<8){
					return '';
				}
				var http= url.substring(0,8);
				if(http==='https://'){
					return url;
				}
				else if(http==='/static/'){
					return url;
				}
				else{
					return (this.baseUrl+url);
				}
			},
			
		},
	}
</script>

<style scoped>
/* 自定义样式 */
.container {
  /* ... */
}
 
.zoomablev{
  width: 100vw;
  height: 100vh;
}

.map-show-wrap {
  width: 100%;
  height: 100%;
}
</style>