没什么好分析的,直接上代码:

<template>
... ...
  <img src='@/assets/logo.png' style='height: 100%' :style='{ width: logoWidth + "px" }' @load='justifyImgWidth($event)' />
... ...
</template>
<script>
... ...
  data: () => ({
... ...
    logoWidth: 0
... ...
  }),
  methods: {
... ...
    justifyImgWidth (e) {
      // ratio = orgin width / origin height = 968 / 352 = 2.75
      this.logoWidth = e.currentTarget.clientHeight * 2.75
    },
... ...
</script>
Logo

前往低代码交流专区

更多推荐