链接jquery循环以作出反应，没有显示任何错误。

Question

开发我的react时也会遇到同样的问题。所以我使用这样的命令导入了JQuery

npm install jquery

后来我从网站下载了一个js min文件，

https://redopop.com/loupe/

你可以在顶端找到它。它的名字叫jquery.loupe.min.js。因此，我复制了它，并在src文件夹中创建了自己的js文件。

在我的标题中，我包含了所有的In文件：

import $ from 'jquery';
import './jquery.loupe.min.js'

在我的功能中，我尝试调用循环：

  if (this.props.activeItem === "Loop") {
    $('graph').loupe();
    //window.$ = window.jQuery = require('jquery')
    //window.$('graph').loupe();
  }

我认为第二行和第三行应该能工作，但结果是一样的。没有错误，但什么也没有。窗口$的console.log

     content.js?5f7c:406 ƒ ( selector, context ) {


    // The jQuery object is actually just the init constructor 'enhanced'
    // Need init if jQuery is called (just allow error to be thrown if not included)
    return new jQuery…

因此，在我的呈现方法中，我有一个想要与循环连接的画布：

  <div className="canvas">
    <canvas
      id="graph"
      className="canvas-actual"
      width="800px"
      height="480px"
      ref={this.canvasRef}
      onMouseDown={this.handleMouseDown}
      onMouseMove={this.handleMouseMove}
      onMouseUp={this.handleMouseUp}
    >
    </canvas>

什么都没发生。没有错误或警告。我不知道这有什么关系。谢谢。代码(需要python2)

https://github.com/andr1312e/React-recognize

Answer 1

嗨，安德鲁，如果你用react.js我为你建议的图书馆反应-图像放大镜

如果使用react，请使用此

反应-图像放大镜:反应，图像放大反应组件的鼠标和触摸集合.

npm中的视图：https://www.npmjs.com/package/react-image-magnifiers

react图像放大镜演示：https://adamrisberg.github.io/react-image-magnifiers/

github：https://github.com/AdamRisberg/react-image-magnifiers