# Vue使用Iframe

Vue使用Iframe

1.代码实现如下：

<template>
  <center>
    <div class="accept-container">
      <iframe
        v-show="iframeState"
        id="show-iframe"
        frameborder="0"
        name="showHere"
        scrolling="auto"
        src="http://localhost:5601/app/canvas#/"
      ></iframe>
    </div>
  </center>
</template>

<script>
export default {
  name: "hello",
  data() {
    return {};
  },
  created() {
    this.iframeState = true;
  },
  mounted() {
    const oIframe = document.getElementById("show-iframe");
    const deviceWidth = 1400;
    const deviceHeight = 650;
    oIframe.style.width = deviceWidth + "px";
    oIframe.style.height = deviceHeight + "px";
  }
};
</script>
<style scoped></style>

2.实现效果如下