采用样式穿透更改组件背景颜色

1.react技术栈组件Protable

import ProTable, { ActionType, ProColumns } from '@jetlinks/pro-table';

 将上面组件的样式改为如下图所示：

 代码：

/*index.less*/
  
  /*外围背景样式*/
  .custom-table .ant-card {
    background-color: #003366;
    color:#000;
   }
  /* 自定义单元样式 */
  .custom-table .ant-table-cell {
    background-color: #6cb0c7  ;
    color:#000;
  }
  /*总条数样式 */
  .custom-table .ant-pagination-total-text {
    color:#fff;
  }
  /*右上角图标样式*/
  .custom-table .ant-pro-table-list-toolbar-setting-item {
    color:#fff;
  }
  /*右下角左右翻页图标*/
  .custom-table .ant-pagination-item-link {
    color:#fff;
  }

import './index.less';

<ProTable<runStatsItem>
  className="custom-table"
  actionRef={actionRef}
  params={param}
  columns={columns}
  tableStyle={{ backgroundColor: '#003366' }}
  search={false}
  request={async (params) =>
   service.query({
    ...params,
    sorts: [
     { name: 'createTime', order: 'desc' },
     { name: 'id', order: 'desc' },
           ],
   })
  }
/>

2.VUE2技术栈样式穿透

.collapse{
  ::v-deep .uni-collapse-item__title-text{
	 flex: 1;
	 margin-left: -0.2rem;
	 font-size: 31rpx;
	 font-weight: bold;
	 white-space: nowrap;
	 color: #5b5b5b;
	 overflow: hidden;
	 text-overflow: ellipsis;
  }
}