Element ui colorpicker在Vue中的使用


首先要有一個color-picker組件

  <el-color-picker v-model="headcolor"></el-color-picker>

在data里面

data() { return {

headcolor: ’ #278add ’ //這里可以選擇一個默認的顏色

} }

 

然后在你想要改變顏色的地方用v-bind綁定就好了,例如:

<el-header class="header" style="height:50px;" :style="{background:headcolor}">

這里的:style 還可以是:class

這樣就可以動態改變主題顏色了,其他的用法可以參考官方例子:https://element.eleme.io/#/zh-CN/component/color-picker

 

效果如下:

 


免責聲明!

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



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