如何在按钮点击时增加localstorage中的值？

Question

在我的Web应用程序的一个屏幕中，用户输入了存储在localstorage中的数值。在下一个屏幕中，用户可以单击一个按钮，其中localstorage值将增加一次值;让我们说添加5.因此，如果变量X的localstorage在按钮上为5，则它将更新为10。

我该怎么做？我存储了值，但我不知道如何操作按钮单击时的值。

使用范围滑块作为输入实现我当前localstorage的codepen。

https://codepen.io/anon/pen/WMqrqe

var updateValuesMinutes = function(){
$to.prop("value", to);
localStorage.setItem( 'StoreMinutes', to); 
let localMinutes = localStorage.getItem("StoreMinutes"); 
console.log(localMinutes); 
};

Answer 1

你只缺少一行代码来实现这个目的：

var updateValuesMinutes = function(valueToIncrementBy){
  $to.prop("value", to);
  localStorage.setItem( 'StoreMinutes', to); 
  let localMinutes = localStorage.getItem("StoreMinutes"); 
  console.log(localMinutes); 
  // This is what you're missing.

  localStorage.setItem('StoreMinutes', !isNaN(parseInt(localMinutes)) ? parseInt(localMinutes) + valueToIncrementBy : valueToIncrementBy);
};

然后，您可以调用此函数来增加值，如下所示：

updateValuesMinutes(5); // This will update the localStorage value by 5 more than it already is.

Answer 2

本地存储值通常存储为字符串，因此需要在它们递增之前转换为数字。

localStorage.setItem( 'StoreMinutes', to); 
//convert string to integer
let localMinutes = parseInt(localStorage.getItem("StoreMinutes")); 
localStorage.setItem('localMinutes', localMinutes++)
console.log(localMinutes); 
};