我们如果遇到[ miniprogram/app.json 文件内容错误] miniprogram/app.json: [“workers”] 字段需为 目录(env: Windows,mp,1.06.2209190; lib: 2.21.4)这样的错误,那么一定是我们在app.json中定义了这个字段。

一、解决错误

1.方法一:

找到这个字段直接删除即可。
在这里插入图片描述

2.方法二:

在你的项目目录中补充一个对应的workers目录即可。
在这里插入图片描述
上面两种方法只不过是令小程序调试的时候不报错,但实际我们要正利用好worker那就要复杂一些。继续看下面的介绍。

二、关于worker及使用

workers究竟是来干什么的,其实微信的文档中已经说明了,这就是我们在其他编程语言中遇到的线程。
参考这里
要真正使用worker必须满足下面的两步:

1、为worker目录下添加js文件

在其目录下添加完成js文件并编写一个可供调用的函数,提供给worker调用。这里我们命名为index.js(名称无所谓,关键在后面的页面js文件中要如实的按照路径和名称填写在createworker构造函数中)

// index.js
//这里的onMessage函数是供声明了worker实例的页面js调用的
worker.onMessage(function(res){
  console.log('worker inner thread is running')
  console.log(res)
  let sum = times(res.x,res.y);  //这里调用了下面的times函数
  worker.postMessage({
    sum : sum
  })
});

//声明被调用的函数
function times(x,y){
  return x*y;
}

2、从页面js中调用

在需要调用worker线程的页面的函数中添加worker实例,并调用worker目录下已有的js文件的函数
这里就是某个页面的js的调用,我们首先在onLoad里面实例化一个woker,并在createWorker构造函数中给予worker文件夹的绝对路径,一定是绝对路径,建议放在minprogram目录下好。

onLoad: function (options) {

    const worker = wx.createWorker('/workers/index.js');
    worker.postMessage({     //与前面worker目录下index.js下声明的函数名对应
      x : 10,
      y : 2
    });

    worker.onMessage(function(res){ //与前面worker目录下index.js下声明的函数名对应
      console.log('print from worker thread result.')
      console.log(res)
    });
    
  },

输出结果为:
在这里插入图片描述

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐