SHARE 方法正在发送旧版本的数据

Question

我正在开发一个在线文字游戏网站，以供娱乐。我最近添加了使用 Javascript 完成拼图的共享。它运行良好，共享的结果正是我所期望的。

但是，如果我重置拼图并再次完成它，通过 SHARE 发送的数据是具有第一个分数的第一组数据，而不是第二个。

s = "I just finished the Addergram puzzle for " + this.fileName().substring(0,11) + "\n\n"
  + "I scored " + this.totalScore + " %"
  + "\n\n"
  + s;
//console.log(s);
const shareData = {
  title: "Addergrams",
  text: s,
  url: "https://addergrams.com",
};

在上面的代码段中，s是一个多行字符串，显示反映拼图状态的表情符号。正如我所说，第一次一切正常，但后续共享会发送过时的数据。如果未注释掉，console.log 显示数据正在正确重建 - SHARE api 是否需要执行任何操作才能在再次发送之前重置数据？

为了完整起见，“共享”按钮上的事件侦听器定义为 ...

btn.addEventListener("click", async () => {
  try {
    await navigator.share(shareData);
  } catch (err) {
    console.log(err);
  }

编辑添加数据...

在新的浏览器选项卡（Windows 11 上的 Edge）中打开页面，并运行 2 遍以不同的方式完成拼图，结果如下。

通过 1 ...

Logged to console ...
I just finished the Addergram puzzle for 07-SEP-2023

I scored 46 %

🔵🔵🔵
🔵🔵🔵🔵
🟠🟠🟠🟠🟠
🟠🟠🟠🟠🟠🟠
🟣🟣🟣🟣🟣🟣🟣
🟣🟣🟣🟣🟣🟣🟣🟣
⚫🔵🔵🔵🔵🔵⚫🔵🔵
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫

Shared to GMAIL ...
Addergrams
https://addergrams.com/
I just finished the Addergram puzzle for 07-SEP-2023

I scored 46 %

🔵🔵🔵
🔵🔵🔵🔵
🟠🟠🟠🟠🟠
🟠🟠🟠🟠🟠🟠
🟣🟣🟣🟣🟣🟣🟣
🟣🟣🟣🟣🟣🟣🟣🟣
⚫🔵🔵🔵🔵🔵⚫🔵🔵
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫

到目前为止一切顺利。
通过2...

Logged to console ... (correct)

I just finished the Addergram puzzle for 07-SEP-2023

I scored 6 %

⚫⚫⚫
⚫⚫⚫⚫
⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫
🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵🔵

Shared to GMAIL ... (incorrect)
Addergrams
https://addergrams.com/
I just finished the Addergram puzzle for 07-SEP-2023

I scored 46 %

🔵🔵🔵
🔵🔵🔵🔵
🟠🟠🟠🟠🟠
🟠🟠🟠🟠🟠🟠
🟣🟣🟣🟣🟣🟣🟣
🟣🟣🟣🟣🟣🟣🟣🟣
⚫🔵🔵🔵🔵🔵⚫🔵🔵
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫
⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫⚫

字符串肯定是在每次谜题迭代中重新构建的。该字符串被输入到 shareData 构造中，该构造被传递给事件侦听器，但它不是共享的。

我突然想到一个想法。事件侦听器在每次传递时都绑定到按钮，但第二次传递不会重新绑定，因为第一传递中的事件仍然绑定吗？

编辑2 我将 shareData 作为主游戏板类的参数，将文本更新到那里并将事件侦听器更改为...

btn.addEventListener("click", async () => {
  try {
    await navigator.share(this.shareData);
  } catch (err) {

结果 - 问题解决了。

Answer 1

我解决了以下问题...希望它对其他人有帮助。

我将 shareData 作为主游戏板类的参数，将文本更新到那里并将事件侦听器更改为...

btn.addEventListener("click", async () => {
  try {
    await navigator.share(this.shareData);
  } catch (err) {

结果——问题解决了。简而言之，当我使用本地构造的变量绑定事件侦听器时，该变量（显然）静态绑定在事件侦听器内。通过将 shareData 存储到单例类对象的参数中并将其传递到事件侦听器函数中，每次传递都可以更新数据。