Установите localalstorage для функции, которая кэширует значения цвета - PullRequest
Новая
       9

Установите localalstorage для функции, которая кэширует значения цвета

1 голос
/ 05 мая 2019

Мне нужно кэшировать шестнадцатеричное значение / цвет каждого ввода, который устанавливается путем вызова функции.

Я пытался кэшировать каждый цвет, переписывая дублирующиеся функции для кэширования под нагрузкой, но мне было интересно, можно ли это сделать с помощью одной функции. 

  function boardNames(color){
        for (var i = 0; i < document.getElementsByClassName('topname').length; i++) {
            document.getElementsByClassName('topname')[i].style.color = color
        }
  }
function leaderboardMass(color){
    for (var i = 0; i < document.getElementsByClassName('topmass').length; i++) {
        document.getElementsByClassName('topmass')[i].style.color = color
    }
 }

     $('.demo').minicolors({
        change: function(value) {
          if(this.id === 'bn-theme-e'){boardNames(value)}
          if(this.id === 'lm-theme-e'){leaderboardMass(value)}

        }
    });

1 Ответ

0 голосов
/ 05 мая 2019

Вы можете хранить строковый объект внутри localStorage. Таким образом, вы можете использовать и индексировать несколько разных цветов. В моем примере я использую имена классов элементов для хранения индекса значений цвета. 

// Color all items that have been set
boardNames = () => {
  let colors = JSON.parse(localStorage.getItem('nc'));
  if (colors) {
    Object.entries(colors).forEach(([k, v]) => {
      Array.from(document.getElementsByClassName(k)).forEach(c => {
        c.style.color = v;
      });
    });
  }
  localStorage.setItem('nc', JSON.stringify(colors));
}

// Set the className with new color value
setBoardColor = (className, color) => {
  let colors = JSON.parse(localStorage.getItem('nc'));
  colors[className] = color;
  localStorage.setItem('nc', JSON.stringify(colors));
}
...