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 之類的
 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM