Install

npm install @xintao1105/link

or

yarn add @xintao1105/link

Basic Usage

import Link from '@xintao1105/link';
import type { linkProps } from '@xintao1105/link';

const ars:linkProps = {
    autoOpen: false,
    target: "_blank",
    levelalignment: "center",
    verticalalignment: "center",
    style: {
        textAlign: "center",
        fontFamily: "Microsoft Yahei",
        fontSize: "32px",
        color: "#ffffff",
        fontWeight: "normal",
        letterSpacing: 0,
        lineHeight: "48px",
        fontStyle: "normal"
    },
    showShadow: false,
    data: {
        url: "http://www.fanliantech.com/",
        text: "文 字 超 链 接 ➚",
    },
  }

<Link {...ars}/>

Component Interface

interface dataType {
    url: string;
    text: number | string;
}

interface linkProps {
    /**
     * 水平对齐方式
     */
    levelalignment?: "left" | "center" | "right"
    /**
     * 垂直对齐方式
     */
    verticalalignment?: "top" | "center" | "bottom"
    /**
     * 文本样式
     */
    style?: CSSProperties
    /**
     * 是否阴影
     */
    showShadow?: boolean
    /**
     * 水平阴影的偏移量 showShadow:true 时生效
     */
    hShadow?: number
    /**
     * 垂直阴影的偏移量 showShadow:true 时生效
     */
    vShadow?: number
    /**
     * 阴影的模糊程度 showShadow:true 时生效
     */
    blurShadow?: number
    /**
     * 阴影的颜色 showShadow:true 时生效
     */
    colorShadow?: string
    /**
     * 默认打开链接 当前窗口页面href链接中包含"/edit/"字段时 autoOpen:true 失效
     */
    autoOpen?: boolean
    /**
     * 打开链接方式 _blank：新打开窗口中载入，_self：当前窗口中载入
     */
    target?: "_blank" | "_self"
    /**
     * 链接限制 是否设置noreferrer、noopener、nofollow, limit:true/false
     */
    limit?: boolean
    /**
     * 数据
     */
    data?: dataType;
    /**
     * 事件
     */
    onClick?: (e: dataType) => void;
}