如何在 onClick 事件中增加计数器值？答案

【问题标题】：How to increment counter value inside an onClick event?如何在 onClick 事件中增加计数器值？
【发布时间】：2019-03-21 17:25:55
【问题描述】：

我对 Google App Maker 和一般编程很陌生，我正在制作一个应用程序，当单击“+”按钮（onClick 事件）时添加字段（有点像表格中的新行，每个点击）。我正在尝试制作一个计数器来跟踪正在创建多少“行”。问题是，由于在 App Maker 中所有代码显然都必须在 onClick 事件中生成，因此我无法设置全局变量，并且每次单击按钮时计数器都会重新启动，因此始终为 1。

我尝试使用 localStorage，但我不完全知道如何使它工作，因为它仍然会始终保存相同的值。我该如何解决这个问题？

  var count = 0;
  count = count +1;
  localStorage.setItem('counter', JSON.stringify(parseFloat(count)));

  textArea.className = 'app-TextArea';
  textArea.style.margin = '8px';
  textArea.setAttribute("placeholder", "Follow up # " + localStorage.getItem('counter');

  widget.root.descendants.Panel1.getElement().appendChild(textArea);

【问题讨论】：

如果这是一个onClick事件，请您发布周围的代码。
就是这样，在 App Maker 中，我似乎无法添加周边代码。它只是提供了添加 onClick 事件并在那里添加代码的选项，因此我无法在 onClick 事件之外初始化“count”。

标签： javascript counter google-app-maker

【解决方案1】：

您应该首先从localStorage 获取数据，然后将其递增，最后将新值设置为localStorage。

var count = parseInt(localStorage('counter')) || 0; // Get value from localStorage 
count = count + 1;
localStorage.setItem('counter', count); // Set new value to localStorage

textArea.className = 'app-TextArea';
textArea.style.margin = '8px';
textArea.setAttribute("placeholder", "Follow up # " + count); // Use new value

widget.root.descendants.Panel1.getElement().appendChild(textArea);

【讨论】：

【解决方案2】：

您可以使用页面custom properties。

所以在页面中，你可以添加一个Number自定义属性并将其命名为counter。那么你的代码应该是这样的：

  var count = widget.root.properties.counter || 0;
  count += 1;
  widget.root.properties.counter = count;

  textArea.className = 'app-TextArea';
  textArea.style.margin = '8px';
  textArea.setAttribute("placeholder", "Follow up # " + count);

  widget.root.descendants.Panel1.getElement().appendChild(textArea);

【讨论】：