Skip to content

Commit f372e89

Browse files
committed
doc: 增加 ZIndex 参数说明
1 parent d423711 commit f372e89

File tree

1 file changed

+24
-22
lines changed

1 file changed

+24
-22
lines changed

src/BootstrapBlazor.Server/Components/Samples/DrawerServices.razor

Lines changed: 24 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -29,26 +29,28 @@ private DrawerService? DrawerService { get; set; }</Pre>
2929

3030
<p class="code-label">4. 常见问题</p>
3131

32-
<div>
33-
<GroupBox Title="代码中如何关闭弹窗" class="mb-3">
34-
<p>在使用弹窗的过程中基本都是需要根据自己的业务需求放置一些业务逻辑处理按钮的,比如放置 <b>关闭</b> <b>保存</b> <b>应用</b> 等等,这些按钮逻辑有些是需要处理业务逻辑结束后,根据业务逻辑处理结果决定是否关闭弹窗,代码关闭弹窗我们组件库内置了一下几种办法</p>
35-
36-
<ul class="ul-demo">
37-
<li>弹窗关闭按钮 <code>DialogCloseButton</code></li>
38-
<p>这个组件时专门为弹窗设计的按钮组件,此组件内置了关闭所在弹窗功能,无需任何代码</p>
39-
<Pre>&lt;DialogCloseButton&gt;</Pre>
40-
<p>业务逻辑可使用 <code>OnClick</code> 或者 <code>OnClickWithoutRender</code> 处理,结束后自动关闭弹窗</p>
41-
<li>关闭回调方法</li>
42-
<Pre class="mt-3">[CascadingParameter]
32+
<GroupBox Title="代码中如何关闭弹窗" class="mb-3">
33+
<p>在使用弹窗的过程中基本都是需要根据自己的业务需求放置一些业务逻辑处理按钮的,比如放置 <b>关闭</b> <b>保存</b> <b>应用</b> 等等,这些按钮逻辑有些是需要处理业务逻辑结束后,根据业务逻辑处理结果决定是否关闭弹窗,代码关闭弹窗我们组件库内置了一下几种办法</p>
34+
35+
<ul class="ul-demo">
36+
<li>弹窗关闭按钮 <code>DialogCloseButton</code></li>
37+
<p>这个组件时专门为弹窗设计的按钮组件,此组件内置了关闭所在弹窗功能,无需任何代码</p>
38+
<Pre>&lt;DialogCloseButton&gt;</Pre>
39+
<p>业务逻辑可使用 <code>OnClick</code> 或者 <code>OnClickWithoutRender</code> 处理,结束后自动关闭弹窗</p>
40+
<li>关闭回调方法</li>
41+
<Pre class="mt-3">[CascadingParameter]
4342
private Func&lt;Task&gt;? OnCloseAsync { get; set; }</Pre>
44-
<p>弹窗内部任何组件中均可以通过此级联参数获得一个关闭弹窗的方法,可以根据自己的业务逻辑需求自行调用关闭弹窗</p>
45-
<p><b>注意:</b>级联参数定义可以随意不一定是 <code>OnCloseAsync</code> 也可以根据自己需要更改为 <code>CloseDrawerAsync</code></p>
46-
</ul>
47-
<ul class="ul-demo">
48-
<li>关闭按钮 <code>DialogCloseButton</code></li>
49-
<p>点击后直接关窗,不进行业务逻辑处理</p>
50-
<li>保存按钮 <code>DialogSaveButton</code></li>
51-
<p>点击按钮后触发 <code>OnSaveAsync</code> 回调方法,根据返回值决定是否关闭弹窗,返回 <b>true</b> 时关闭</p>
52-
</ul>
53-
</GroupBox>
54-
</div>
43+
<p>弹窗内部任何组件中均可以通过此级联参数获得一个关闭弹窗的方法,可以根据自己的业务逻辑需求自行调用关闭弹窗</p>
44+
<p><b>注意:</b>级联参数定义可以随意不一定是 <code>OnCloseAsync</code> 也可以根据自己需要更改为 <code>CloseDrawerAsync</code></p>
45+
</ul>
46+
<ul class="ul-demo">
47+
<li>关闭按钮 <code>DialogCloseButton</code></li>
48+
<p>点击后直接关窗,不进行业务逻辑处理</p>
49+
<li>保存按钮 <code>DialogSaveButton</code></li>
50+
<p>点击按钮后触发 <code>OnSaveAsync</code> 回调方法,根据返回值决定是否关闭弹窗,返回 <b>true</b> 时关闭</p>
51+
</ul>
52+
</GroupBox>
53+
54+
<GroupBox Title="设置 z-index 调整遮挡问题">
55+
<p>通过设置 <code>DrawerOption</code> 参数 <code>ZIndex</code> 值调节抽屉 z-index 位置,防止被其他弹窗遮挡</p>
56+
</GroupBox>

0 commit comments

Comments
 (0)