您应该为JQuery函数创建一个React组件 Package 器。
您必须手动管理React生命周期-通过在useEffect()回调中调用JQuery函数，并注意在清理中删除DOM元素：

function ReactWrapper() {
  const { loading, error, data } = useQuery(ME_QUERY);
  const [ data, setData ] = React.useState();
  React.useEffect(() => {
    jqueryFn();
    $('#like').on('click', function(){ setData('from click') });
    return () => {
       /* code that removes the DOM elements created by jqueryFn() */
    };
  }, []);

  if (loading) return 'Loading...';
  if (error) return `Error! ${error.message}`;

  return <div>{data}</div>;
}

然后，在这个React组件中，将允许使用钩子。
另外，如果JQuery函数非常简单，那么用React重写它可能会更好。

正如安迪在评论中所说：“You shouldn 't be mixing jQuery and React.”--但是，我们都曾处于别无选择的境地。如果您别无选择，只能使用jQuery沿着React，下面示例中的代码可能会有所帮助。
示例略有不同（没有画布等），但您应该能够看到您需要的内容。
这个示例超出了您的问题，并预测了下一个问题-“我如何访问和使用jQuery添加的[card、div、section等]中的数据？”
这是一个工作正常的StackBlitz EDIT -固定链接
请参见代码中的注解：

// jQuery Addition - happens outside the React App
$('body').append(
  $(`<div class="d-flex flex-wrap my-2"><img class="else_picture" src="${elem.artworkUrl600}" height="10px"><div class="mx-2"><div class="elseTitle" id="${elem.trackId}">${elem.trackName}</div><h6>by:${elem.artistName}</h6><h6>keywords:</h6><p>${elem.genres}</p><div class="d-flex justify-content-start"><button value="${elem.feedUrl}" class="get_description"><a target="_blank" href="${elem.trackViewUrl}">Info link</a></i></button><div class="like_box"><i id="like" class="fa fa-thumbs-up"></div></div></div><hr>`)
);

export default function App() {
  // state to hold the like data
  const [likes, setLikes] = useState([]);
  // create reference to the jquery element of importance
  // This ref will reference a jQuery object in .current
  const ref = useRef($('.elseTitle'));
  // Like function
  function Like(x) {
    // ref.current is a jQuery object so use .text() method to retrieve textContent
    console.log(ref.current.text(), 'hit Like function');
    setLikes([...likes, ' :: ' + ref.current.text()]);
  }
  // This is where you put
  useEffect(() => {
    // Add event listener and react
    $('#like').on('click', function () {
      Like(this);
    });
    // Remove event listener
    return () => $('#like').off('click');
  });
  return (
    <div>
      <h1>Likes!</h1>
      <p>{likes}</p>
    </div>
  );
}