vue的ui库使用Element UI，纯html页面，不使用webpack那玩意

使用手册访问：https://cloud.tencent.com/developer/doc/1270

 

第一步：在head添加样式

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

第二步：在html代码之后加
  <!-- 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>

注意：使用element标签的div的id必须在new vue{}对象里：

例如：
<body>
  <div id="app">　　--element标签的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>
    new Vue({
      el: '#app',　　---那么#app就必须在new Vue的el里
      data: function() {
        return { visible: false }
      }
    })
  </script>

注：不用安装什么npm i element-ui -S 之类的
 

 

posted @ 2018-12-15 09:34  梦中的鱼  阅读(8513)  评论(0)  编辑  收藏  举报