vue框架iframe展示文件时使文件长宽和iframe的长宽一致

在Vue框架中，要使文件的长宽与iframe的长宽一致，可以通过以下步骤实现：

1. 在Vue组件中，使用v-bind指令绑定iframe的宽度和高度属性到组件的data属性上。例如：

<template>
  <div>
    <iframe :width="iframeWidth" :height="iframeHeight" src="path/to/file"></iframe>
  </div>
</template>

<script>
export default {
  data() {
    return {
      iframeWidth: '',
      iframeHeight: ''
    }
  },
  mounted() {
    // 获取文件的宽度和高度
    const fileWidth = document.getElementById('file').contentWindow.document.body.offsetWidth;
    const fileHeight = document.getElementById('file').contentWindow.document.body.offsetHeight;

    // 将文件的宽度和高度赋值给iframe的宽度和高度
    this.iframeWidth = fileWidth + 'px';
    this.iframeHeight = fileHeight + 'px';
  }
}
</script>

2. 在mounted钩子函数中，通过获取iframe内部文档的宽度和高度，将其赋值给组件的data属性中的iframeWidth和iframeHeight。