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