zoukankan      html  css  js  c++  java
  • 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

  • 相关阅读:
    [GEF]实现模板功能
    一篇WTP文章
    写代码的代码:JET
    投票选择eclipse.org的新界面
    在SWT里显示AWT对象
    Plugin.xml > Manifest.mf
    关于本体编程的实现
    一个用OWLS组装Web服务的例子
    感受Ruby on Rails
    通过OCP考试
  • 原文地址:https://www.cnblogs.com/wwct/p/14588749.html
Copyright © 2011-2022 走看看