italent 表情组件
示例 1-使用默认表情
内置表情使用了动态 import(), 所以在项目构建的时候请保证构建工具支持通过 import('xxx')导入模块
npm install italent-emoji --save
;;;; const abs = `position:absolute`; const EmojiLeftTop = styleddiv` ; left: 20px; top: 20px;`; const EmojiRightTop = styleddiv` ; right: 20px; top: 20px;`; const EmojiLeftBottom = styleddiv` ; left: 20px; bottom: 20px;`; const EmojiRightBottom = styleddiv` ; right: 20px; bottom: 20px;`; Component { return import"./data/italent.json"; } { return <div> <EmojiLeftTop> /**使用自定义数据 */ <Emoji getData=thisgetData>Left Top</Emoji> </EmojiLeftTop> <EmojiRightTop> /**当点击的时候获取当前点击的表情数据 */ <Emoji onSelect=consolelog getData=thisgetData> right Top </Emoji> </EmojiRightTop> <EmojiLeftBottom> <Emoji getData=thisgetData config= meep: rowSize: 7 imgSize: 46 cellSize: 61 > Left bottom </Emoji> </EmojiLeftBottom> <EmojiRightBottom> <Emoji getData=thisgetData>Right bottom</Emoji> </EmojiRightBottom> </div> ; } ;
参数
className 给 emoji 添加一个自定义的 className
getData 自定义的表情数据,需要返回一个promise
onSelect 当点击一个表情的执行的回调,返回数据为 emojiItem {url, title}
config 配置一个tabs下的图标尺寸,详见示例