html代码
查看代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="./css/element.css">
<script src="./js/vue.js"></script>
<script src="./js/element.js"></script>
</head>
<body>
引入vue 和 element-ui
<div id="app">
{{message}}
<el-row>
<el-button @click="abc()">默认按钮</el-button>
<el-button type="primary" @click="ccc()">主要按钮</el-button>
<el-button type="success">成功按钮</el-button>
<el-button type="info">信息按钮</el-button>
<el-button type="warning">警告按钮</el-button>
<el-button type="danger">危险按钮</el-button>
</el-row>
</div>
<script type="text/javascript">
var vue = new Vue({
el:'#app',
data:{
message: 'aaaa',
flag: true
},
methods : {
abc : function () {
this.message='bbbbbb'
},
ccc: function () {
this.message = '666666666666'
}
}
})
</script>
</body>
</html>其中html中的vue.js 、element.js、element.css都放在 resource目录里