vue-cli2嵌入html

1.使用iframe

<!-- 相对路径/绝对路径 -->
<iframe src="../../../static/zsw.html"></iframe>
<!-- 网址 -->
<iframe src="https://cn.vuejs.org/v2/api/#v-html"></iframe>

2.使用v-html

<template>
  <div class="mod-config">
    <span v-html="html"></span>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        html: '',
      }
    },

　　　 created () {

      　　let param = {

        　　accept: 'text/html, text/plain'

      　　}

      　　let url = 'https://cn.vuejs.org/v2/api/#v-html'

      　　// let url = './static/html/disk.html'

      　　this.$http.get(url, param).then((response) => {

        　　this.loading = false

        　　// 处理HTML显示

        　　this.html = response.data

     　　).catch(() => {

        　　this.loading = false

        　　this.html = '加载失败'

      　　})

      　　this.getCaptcha()

    　　}

  }
</script>

还会出现跨域的情况

推荐：https://www.php.cn/js-tutorial-386304.html

3.iframe和v-html的区别

如果是直接引入html文件，v-html只加载html文件中的行内元素和内嵌样式，不加载外部样式（因此也可能不会加载外部的js脚本）。iframe可以加载外部的资源。

4.vue-cli的静态目录

在Vue-cli 2.0 构建的项目中使用 iframe 引用本地静态 html 文件，放在 static文件夹下。
在Vue-cli 3.0 构建的项目中使用 iframe 引用本地静态 html 文件，放在 public 文件夹下。
推荐：https://blog.csdn.net/rudy_zhou/article/details/106003587