vue項目element ui 樹狀控件樣式問題


場景:

  1.樹狀控件數據類型,由於結構中含有children [ {_e} ]數據類型,所以導致樹狀結構不完整的顯示問題。

  解決方案:主要在el-tree標簽上默認展示所有的子節點。(添加屬性:default-expand-all)

 <el-tree  :data="groupList" node-key="id" default-expand-all>
            <div class="custom-tree-node" slot-scope="{ node, data }">
              <!-- <span v-if="node.isLeaf"> 攝像頭:</span> -->
              <span>{{ data.label }}</span>
               <span v-if="node.isLeaf" class="nodeButton">

            <el-button type="success" size="mini"  @click="setting(node,data)">配置</el-button> 
               </span>
              <!-- <span v-if="!node.isLeaf"> ({{ data.children.length }})</span> -->
               </div> 
         </el-tree>      

  

  2.樹狀控件的樣式問題,當主題顏色為黑色時,需要對樣式進行修改,有時會出現樣式錯亂的問題。

/* 樹狀圖樣式 */
.el-tree-node.is-current > .el-tree-node__content {
  background-color: white !important;
  color: black;
}

// 主題色為黑色
// 字體為白色

  


免責聲明!

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



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