
AnchorLink 锚点链接
应用于标题带 Hash 的锚点链接,点击拷贝方便分享
普通用法
放置标签后点击拷贝锚点链接到粘贴板
Demo
我是一个可以点击的锚点链接
Attributes
Loading...
@page "/anchorlinks"
<h3>AnchorLink 锚点链接</h3>
<h4>应用于标题带 <b>Hash</b> 的锚点链接,点击拷贝方便分享</h4>
<DemoBlock Title="普通用法" Introduction="放置标签后点击拷贝锚点链接到粘贴板" Name="Normal">
<AnchorLink Text="我是一个可以点击的锚点链接" Id="AnchorLink1" class="anchor-link-demo" />
</DemoBlock>
<Tips class="mt-3">
<div><code>AnchorLink</code> 锚点链接组件属性 <code>Id</code> 为必填项,不填写时不提供拷贝锚点链接功能</div>
<div>组件锚点图标可通过 <code>Icon</code> 参数进行自定义默认为 <i class="fa fa-link"></i></div>
</Tips>
<AttributeTable Items="@GetAttributes()" />
// Copyright (c) Argo Zhang (argo@163.com). All rights reserved.
// Licensed under the Apache License, Version 2.0. See License.txt in the project root for license information.
// Website: https://www.blazor.zone or https://argozhang.github.io/
using BootstrapBlazor.Components;
using BootstrapBlazor.Shared.Common;
namespace BootstrapBlazor.Shared.Samples;
/// <summary>
///
/// </summary>
public partial class AnchorLinks
{
private static IEnumerable<AttributeItem> GetAttributes() => new[]
{
// TODO: 移动到数据库中
new AttributeItem() {
Name = "Id",
Description = "组件 Id 必填项",
Type = "string",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem() {
Name = nameof(AnchorLink.Icon),
Description = "组件锚点图标",
Type = "string",
ValueList = " — ",
DefaultValue = "fa fa-link"
},
new AttributeItem() {
Name = "Text",
Description = "组件 Text 显示文字",
Type = "string",
ValueList = " — ",
DefaultValue = " — "
},
new AttributeItem() {
Name = "TooltipText",
Description = "拷贝成功后 显示文字",
Type = "string",
ValueList = " — ",
DefaultValue = " — "
}
};
}