Html | Vue | Element UI——引入使用

时间:2023-08-15 16:51:08

前言

做个项目,需要一个效果刚好Element UI有,就想配合Vue和Element UI,放在tp5.1下使用,但是引入在线的地址各种报错,本地引入就完美的解决了问题!

代码

__STATIC_JS__ | 目录为public/static/js

将样式和组件保存到本地再引入

示例代码

  <div id="app">
<el-button @click="visible = true">按钮</el-button>
<el-dialog :visible.sync="visible" title="Hello world">
<p>欢迎使用 Element</p>
</el-dialog>
</div>
<link rel="stylesheet" href="__STATIC_JS__element-ui@2.7.2.css">
<script src="__STATIC_JS__vue.js"></script>
<script src="__STATIC_JS__element-ui@2.7.2.js"></script>
<script>
new Vue({
el: '#app',
data: function() {
return { visible: false }
}
})
</script>

效果图

Html | Vue | Element UI——引入使用

点击按钮后

Html | Vue | Element UI——引入使用