5-3.1、element-ui

element-ui 是饿了么前端出品的基于 Vue.js的 后台组件库，方便程序员进行页面快速布局和构建

官网： http://element-cn.eleme.io/#/zh-CN

创建 06-element-ui.html

将element-ui引入到项目

1、引入css

<!-- import CSS -->
<link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css">

2、引入js

<!-- import Vue before Element -->
<script src="vue.min.js"></script>
<!-- import JavaScript -->
<script src="element-ui/lib/index.js"></script>

3、编写html

<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>

关于.sync的扩展阅读
https://www.jianshu.com/p/d42c508ea9de

4、编写js

<script>
   new Vue({
           el: '#app',
           data: function () {//定义Vue中data的另一种方式
                   return { visible: false }
          }
    })
</script>