vue iframe 内部网页的等比例缩放

要在Vue中实现iframe内部网页的等比例缩放，可以按照以下步骤进行：

1. 在父组件中引入子组件，并设置iframe的样式，例如：

<template>
  <div class="parent">
    <iframe ref="iframe" :src="url" frameborder="0" scrolling="no"></iframe>
  </div>
</template>

<style>
.parent {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
}
.parent iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
</style>

2. 在子组件的mounted生命周期钩子中获取iframe元素，并监听iframe的load事件，获取iframe内部的内容。

mounted() {
  this.$nextTick(() => {
    const iframe = this.$refs.iframe;
    iframe.addEventListener("load", () => {
      const iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
      const iframeBody = iframeDoc.querySelector("body");
      // 在这里对iframe内部的内容进行操作，例如缩放等
    });
  });
}

3. 对iframe内部的内容进行缩放，可以使用CSS的transform属性进行缩放，例如：

const iframeWidth = iframe.offsetWidth;
const contentWidth = iframeBody.offsetWidth;
const scale = iframeWidth / contentWidth;
iframeBody.style.transform = `scale(${scale})`;

这样就可以实现iframe内部网页的等比例缩放了。注意，由于跨域问题，可能会导致获取不到iframe内部的内容，需要在服务器端进行配置。