• Element库的Vue版本ElementUI的本地引入方法


    最近刚接触ElementUI,发现官方介绍的使用方法中只有npm安装和CDN引入这两种方式,没有本地引入的方法。

    因为我的学习环境有时候是断网状态的,所以自己研究了一下本地引入的方法,记录在此。

    1、ElementUI是基于Vue.js的,所以先下载Vue.js
      学习阶段选择开发版本。
            Vue.js 官方下载
    2、下载ElementUI
            ElementUI GitHub
           点击 Clone or download
           再点击 Download ZIP,下载完成后解压,得到lib-master文件夹
    3、新建一个html文件,例如index.html,将Vue.js和lib-master文件夹移动到和index.html同一目录下。
    4、index.html代码如下:

    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="lib-master/theme-chalk/index.css"/>
    </head>
    <body>
      <div id="app">
        <el-button @click="visible = true">Button</el-button>
        <el-dialog :visible.sync="visible" title="Hello world">
          <p>Try Element</p>
        </el-dialog>
          </div>
    </body>
    <script src="vue.js" type="text/javascript" charset="utf-8"></script>
    <script src="lib-master/index.js" type="text/javascript" charset="utf-8"></script>
    <script>
        new Vue({
          el: '#app',
          data: function() {
            return { visible: false }
          }
        })
      </script>
    </html>


    ————————————————
    版权声明:本文为CSDN博主「wly_」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/qq_36275259/article/details/103400133

  • 相关阅读:
    [原创]推荐三款强大且漂亮的统计图控件
    使用ATL设计组件(VC6.0)
    COM笔记引用计数
    远程调试
    记事本2
    C++中类的多态与虚函数的使用
    Eclipse常用快捷键
    怎么在Release下调试代码
    MSDN 无法显示网页
    COM笔记接口
  • 原文地址:https://www.cnblogs.com/rainbow70626/p/14829585.html
Copyright © 2020-2023  润新知