kxmall-ui/kxmall-app-ui/pages/index/components/img1.vue

<template>
	<view  :style="{padding:showStyle}">
		<view v-if="storage" class="bg-white" >
			  <image @click="naviageToPage(nav)" :src="imgUrl"
			  :mode="imgStyle==='cover'?'aspectFill':'scaleToFill'"
			  :style="{borderRadius:borderRadius,height:getHeight}"
				style="width: 100%;"
				></image>
		</view>
	</view>

</template>

<script>
  export default {
    name: 'img1',
    props: ['storage', 'options'],
    computed: {
		imgStyle() {
		  return this.options.imgStyle
		},
		showStyle() {
				if (this.options.showStyle == 'custom'){
				  return this.options.customStyle
				}
				return this.options.showStyle
		},
		nav() {
			return this.options.nav
		},
		imgUrl() {
			let imgUrl = this.options.imgUrl

			if (imgUrl) {
				return JSON.parse(imgUrl)[0].url
			} else {
				return "https://nontax.oss-cn-beijing.aliyuncs.com/kxmall/G2urVA.png"
			}
		},
		borderRadius() {
		  return this.options.borderRadius
		},
		getHeight() {
		  return this.options.height
		}

    },
    methods: {
      naviageToPage(url, title) {
        this.$emit('naviage-to-page', url, title)
      }
    }
  }
</script>

<style scoped lang="scss">

</style>