el-tree props 的自定义节点类名 class 使用问题?

头像
Jason
    1711
    内蒙古呼和浩特市
    1. 代码
    <el-tree
              ref="treeRef"
              class="filter-tree"
              :data="treeDeptData"
              node-key="id"
              :props="defaultProps"
              :default-expand-keys="['1']"
              :filter-node-method="filterNode"
              @node-click="getDeptUser"
            />
    defaultProps: {
            children: 'children',
            label: 'name',
            value: 'id',
            disabled: 'disabled',
            class: function(data){
              if(data.disabled){
                return 'tree_node_disabled'
              }
            }
          },
    .tree_node_disabled{
            color: #a8abb2;
            cursor: not-allowed;
          }

    1684139636002.png

    1. 问题
      以上类名看dom已经绑定成了,但是并没有渲染写的样式 ,哪位大佬知道是什么情况吗
    阅读 5.2k
    2 个回答

    官网有这个属性嘛?
    建议还是用scoped slot插槽方式实现:

    <el-tree
          :data="data"
          node-key="id"
         >
          <span class="custom-tree-node" slot-scope="{ node, data }">
            <span :class="data.disabled?'tree_node_disabled':''">{{ node.label }}</span>
          </span>
        </el-tree>
    新手上路,请多包涵

    我用了样式穿透(deep)才可以的,你试试

    撰写回答
    你尚未登录,登录后可以
    • 和开发者交流问题的细节
    • 关注并接收问题和回答的更新提醒
    • 参与内容的编辑和改进,让解决方法与时俱进
    推荐问题