react-tooltip-plugin

安装 Install

npm install --save react-tooltip-plugin

第一种使用方法 The first method of use

1: 全局引用一次样式
1: Global require onece style

import 'react-tooltip-plugin/lib/toolpic.css'

2: 在需要展示tooltip的模块中
import tooltip from 'react-tooltip-plugin'

onMouseEnter={(e)=>{tooltip({e, msg: 'Toolpic show message', align: 'top'})}}
onMouseLeave={()=>{tooltip({leave: true})}}

align可取值(top,right,bottom,left)默认值是top,当值为top时align可以省略。
align available value (top,right,bottom,left) default value is top,if you set align value is top you can ellipsis it.

第二种使用方法 The second method of use

如果你的css-loader设置了modules:true, 就不需要引入toolpic.css,react-tooltip-plugin/loadcss已经引入了tooltip.css。
If your css-loader setting modules:true, so you don't need required tooltip.css, react-tooltip-plugin/loadcss already require tooltip.css.

import tooltip from 'react-tooltip-plugin/loadcss'

onMouseEnter={(e)=>{tooltip({e, msg: 'Toolpic show message', align: 'top'})}}
onMouseLeave={()=>{tooltip({leave: true})}}