首页 > 解决方案 > 将 Javascript 变量导出到 React 组件中

问题描述

我正在尝试在 React.js 应用程序中使用 Robot.js。我安装了 Robot.js 并且可以运行它以在单独的文件中获取结果。我找不到在 React 组件中运行 Robot.js 的方法,因为我收到错误“robot.getMousePos()”不是函数。我真正需要的是“十六进制”的值。有没有办法将变量导出到我的反应组件中,或者甚至更好地在同一组件中运行 Robot.js 代码而不会出错?

这是 Robot.js 示例:

const color = () => {
  // Get pixel color under the mouse.
  var robot = require("robotjs");

  // Get mouse position.
  var mouse = robot.getMousePos();

  // Get pixel color in hex format.
  var hex = robot.getPixelColor(mouse.x, mouse.y);
  console.log("#" + hex + " at x:" + mouse.x + " y:" + mouse.y);
};

color();

它返回“十六进制”的值,该值等于鼠标在给定 x 和 y 坐标下的十六进制颜色(#1e1e1e at x:746 y:511)

我正在尝试将该输出输入到我的 React 组件中,其代码在这里:

import React from "react";

const Robot = () => {
  return (
    <div>
      <h1>Robot</h1>
    </div>
  );
};

export default Robot;

标签: javascriptreactjsrobotjs

解决方案


Robot.js 是 Node.js 中用于桌面自动化的库。

React 是一个用于在浏览器中进行 DOM 处理的库。

您无法在浏览器中运行依赖于 Node.js 的代码。

如果您希望这两段代码一起工作,那么您需要编写一个可以通过它们进行通信的 Web 服务(或者使用 Electron 之类的东西运行您的代码,然后使用 IPC API 在主进程和渲染器进程之间进行通信) .


推荐阅读