如何让我的表情符号在 emoji-mart 中看起来更漂亮？

Question

我在react js（typescript）项目中使用emoji-mart

emoji-mart 文档： https://github.com/missive/emoji-mart

现在表情符号显示如下：

但是，我想把它们做成这样：

注意：我尝试根据此https://missiveapp.com/open/emoji-mart文档使用“set：apple，facebook等”来制作它。但是，我得到这个：

你能帮我吗？

Answer 1

指定

import emojiMartData from '@emoji-mart/data/sets/[version]/apple.json';

在选择器中，指定：

data={emojiMartData}

Answer 2

我自己花了一个多小时试图弄清楚它，并且终于让这个东西可以在 TypeScript/React 文件上工作了。 这是我的代码，给它一个构建或在键盘上按 Ctrl/Cmd+F5（在浏览器上）即可工作（以防万一）：

// App.tsx

import './App.css'

/*

// This version of the dataset does not work if you're trying to use Apple emojis

 import data from '@emoji-mart/data'

 */
// Use this instead for Apple emojis, I am using "appleEmojisData" as a name for the emoji data-set, but you could name it anything like data, myApplesAreYellow or something absolutely crazy :D

import appleEmojisData from '@emoji-mart/data/sets/14/apple.json'
import Picker from '@emoji-mart/react'

function App() {

  return (
    <Picker data={appleEmojisData} set="apple" onEmojiSelect={console.log} />
  )
}

export default App

请注意，

set="apple"

与

data={appleEmojisData}

一起需要