zoukankan      html  css  js  c++  java
  • element-ui

    npm 安装方法:

    npm i element-ui -S

    CDN:

    <!-- 引入样式 -->

    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

    <!-- 引入组件库 -->

    <script src="https://unpkg.com/element-ui/lib/index.js"></script>

    代码:

    
    
    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
      <!-- import CSS -->
      <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/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>
      <!-- import Vue before Element -->
      <script src="https://unpkg.com/vue/dist/vue.js"></script>
      <!-- import JavaScript -->
      <script src="https://unpkg.com/element-ui/lib/index.js"></script>
      <script>
        new Vue({
          el: '#app',
          data: function() {
            return { visible: false }
          }
        })
      </script>
    
    
    

    </html>

    vue中引入element
    在 main.js 中写入以下内容:
    import Vue from 'vue'
    import ElementUI from 'element-ui'
    import 'element-ui/lib/theme-chalk/index.css'
    import App from './App.vue'
    
    Vue.use(ElementUI)
    
    new Vue({
    el: '#app',
    render: h => h(App)
    })
    
     

     注:import Vue from 'vue'; 

    其实最完整的写法是import Vue from "../node_modules/vue/dist/vue.js";

    1.import...from...的from命令后面可以跟很多路径格式,若只给出vue,axios这样的包名,则会自动到node_modules中加载;若给出相对路径及文件前缀,则到指定位置寻找。
    2.可以加载各种各样的文件:.js、.vue、.less等等。
    3.可以省略掉from直接引入。

  • 相关阅读:
    python_函数设计
    python_自定日历
    python_日历
    python_选择结构
    python_集合
    python_code list_3
    Oracle 游标使用全解
    JavaWeb中验证码的实现
    oracle 存储过程和函数例子
    Oracle中的存储过程简单例子
  • 原文地址:https://www.cnblogs.com/lhqdbk/p/11481841.html
Copyright © 2011-2022 走看看