新建一个worker.js文件,编写worker子线程脚本,代码如下:

const workercode = () => {

  self.onmessage = function(e) {
    console.log('Message received from main script');
    var workerResult = 'Received from main: ' + (e.data);
    console.log('Posting message back to main script');
    self.postMessage(workerResult); // here it's working without self
  }
};
// 把脚本代码转为string
let code = workercode.toString();
code = code.substring(code.indexOf("{")+1, code.lastIndexOf("}"));

const blob = new Blob([code], {type: "application/javascript"});
const worker_script = URL.createObjectURL(blob);

module.exports = worker_script;

 按照上述方式,创建好worker_script,在react项目组件中引用时只需要在对应的组件文件中:

import worker_script from './worker';
var myWorker = new Worker(worker_script);

myWorker.onmessage = (m) => {
       console.log("msg from worker: ", m.data);
};
myWorker.postMessage('im from main');

  

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2022-01-04
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2019-09-03
  • 2021-04-21
猜你喜欢
  • 2022-12-23
  • 2021-04-27
  • 2019-07-25
  • 2021-10-06
  • 2022-12-23
  • 2021-07-27
  • 2021-07-08
相关资源
相似解决方案