0.2.0 • Published 4 years ago

xy-tooltip v0.2.0

Weekly downloads
1
License
MIT
Repository
github
Last release
4 years ago
IEChromeFirefoxOperaSafari
IE 10+ ✔Chrome 31.0+ ✔Firefox 31.0+ ✔Opera 30.0+ ✔Safari 7.0+ ✔

NPM version node version npm download

xy-tooltip

xy-tooltip

提示组件, 封装了xy-trigger增加箭头和配色

安装

# yarn
yarn add xy-tooltip

使用例子

import React from "react";
import ReactDOM from "react-dom";
import Tooltip from "xy-tooltip";
ReactDOM.render(
    <Tooltip popup={<span>Tips: 这是一个按钮</span>}>
        <button>按钮</button>
    </Tooltip>,
    container,
);

API

属性说明类型默认值
visible是否可视boolean
defaultVisible默认是否可视boolean
children包裹元素React.ReactNode
popup弹出内容React.ReactNode
popupClassName弹出内容类名string
popupAlign对齐选项DomAlignOption
offsetSize偏移距离number6
destroyPopupOnHide是否隐藏时销毁booleanfalse
placement显示方向PlacementType
onChange改变是否可视事件(visible: boolean) => void
action触发方式TriggerAction[]'hover'
mouseDelay鼠标事件判定延迟number300
stretch是否宽度与目标宽度对齐boolean
popupClickHide包裹元素点击是否隐藏booleanfalse

PlacementType

"left" | "right" | "top" | "bottom" | "leftTop" | "leftBottom" | "rightTop" | "rightBottom" | "topLeft" | "topRight" | "bottomLeft" | "bottomRight"

TriggerAction

"hover" | "click" | "focus" | "contextMenu"

开发

yarn run start

例子

http://localhost:6006

测试

yarn run test

开源许可

xy-tooltip is released under the MIT license.

0.2.0

4 years ago

0.1.5

5 years ago

0.1.4

5 years ago

0.1.3

5 years ago

0.1.2

5 years ago

0.1.1

5 years ago

0.1.0

5 years ago

0.0.9

5 years ago

0.0.8

5 years ago

0.0.73

5 years ago

0.0.72

5 years ago

0.0.71

5 years ago

0.0.7

5 years ago

0.0.6

5 years ago

0.0.5

5 years ago