Mat Blazor mat-expansion-panel删除高程/边界

问题描述

我想从Mat扩展面板中删除高程/边界.

I want to remove the elevation/border from Mat expansion panel.

我已经阅读过其他相关文章，例如mat-expansion-panel删除边框，但它们在Blazor中不起作用.

I've already read other related articles like mat-expansion-panel remove border but they are not working within Blazor.

我尝试访问background-color属性，但是MatBlazor表示此属性不存在.

I've tried to access the background-color property but MatBlazor is saying this property doesnt exist.

我还尝试过在Mat Expansion面板中使用class =.mat-elevation-z0"，如下所示:

I've also tried using the class=".mat-elevation-z0" inside the Mat Expansion panel like this:

<MatExpansionPanel class=".mat-elevation-z0" @bind-Expanded="@panelOpenState">

不起作用.

此刻的代码看起来像这样:

At the minute the code looks like this:

<MatAccordion>
      <MatExpansionPanel>
          <MatExpansionPanelSummary>
              <MatExpansionPanelHeader>
                Personal data
              </MatExpansionPanelHeader>
              <MatExpansionPanelSubHeader>
                Type your name and age
              </MatExpansionPanelSubHeader>
          </MatExpansionPanelSummary>
        <MatExpansionPanelDetails>
              <MatTextField Label="First name"></MatTextField>
              <MatTextField Label="Age"></MatTextField>
          </MatExpansionPanelDetails>
      </MatExpansionPanel>
 </MatAccordion>

这会使Matblazor扩展面板出现在页面上，但周围带有阴影/高程/边框.我似乎无法消失.我想知道这是否是一个特殊的问题-因为其他使用matt扩展面板(带有javascript等)的人似乎可以解决问题?

This makes a matblazor expansion panel appear on the page but with a shadow/elevation/border round it. i can't seem to get that to dissappear. I'm wondering if it is a specific blazor issue - as others using the matt expansion panel (with javascript, etc) seem to have work arounds?

推荐答案

只需通过Style parm覆盖box-shadow css:

Just override box-shadow css through Style parm:

<MatExpansionPanel Style="box-shadow: none;">

在 blazorfiddle.com

这篇关于Mat Blazor mat-expansion-panel删除高程/边界的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！