Сбой параметров функции из переменных в виде строкового JavaScript

1

Это работает:

setTheme('#222','#000','wheat','red','wheat','none','none');

Это не работает:,

var theme01 = "'#222','#000','wheat','red','wheat','none','none'"; <br>
setTheme(theme01);

console.log(theme01) = '#222','#000','wheat','red','wheat','none','none'

Так что преобразование в строку беспорядок это как-то?

Я буду переключать различные темы перед захватом холста? У меня было все это с CSS, но холст не записывает изменения css или css-инъекции. Итак, теперь у меня есть все готово для использования Vanilla Javascript, но вам нужна помощь после нескольких часов тестирования, чтобы просто передать переменную моей функции.

function setTheme(topp, bott, txt, hlin, vlin, fOrb, sOrb) {
  var xx = document.querySelectorAll(".hlin");
  for (var i = 0; i < xx.length; i++) {
    xx[i].style.stroke = hlin;
  }
  var xx = document.querySelectorAll(".vlin");
  for (var i = 0; i < xx.length; i++) {
    xx[i].style.stroke = vlin;
  }
  var xx = document.querySelectorAll(".txt");
  for (var i = 0; i < xx.length; i++) {
    xx[i].style.fill = txt;
  }
  document.getElementById("svg_20").style.fill = topp;
  document.getElementById("svg_1").style.fill = bott;
  document.getElementById("svg_2").style.fill = bott;
  document.getElementById("svg_3").style.stroke = txt;
  document.getElementById("svg_5").style.stroke = txt;
  document.getElementById("svg_21").style.fill = fOrb;
  document.getElementById("svg_21").style.stroke = sOrb;
};
  • 2
    Так что преобразование в строку портит это? Нет, но все параметры вашего setTheme (кроме первого) не определены, если вы передаете только один ... Все, что вы пытаетесь сделать, далеко не разумно
  • 1
    Одна строка будет одним параметром
Показать ещё 1 комментарий
Теги:

3 ответа

0
Лучший ответ

Строка будет одним параметром для вашей функции. Вы можете использовать Function.apply) 1 с разделенной строкой в качестве второго параметра или даже проще использовать оператор spread 2). Демо-версия:

1) Function.apply

2) оператор распространения

( () => {
  const log = str => document.querySelector("#result").textContent += '${str} \n';
  const parameterString = "#222,#000,wheat";
  // no dice
  log("someFn(parameterString) => no dice"); 
  someFn(parameterString);
  
  // use apply
  log("\nsomeFn.apply(null, parameterString.split(\",\")) => ah yes, that works");
  someFn.apply(null, parameterString.split(","));
  
  // or use spread operator
  log("\nsomeFn(...parameterString.split(\",\")) => ah yes, that works too");
  someFn(...parameterString.split(","));
  
  function someFn(p1, p2, p3) {
    log(p1);
    log(p2);
    log(p3);
  }
  
})();
<pre id="result"></pre>
  • 0
    Спасибо, за такой быстрый ответ, я расшифрую это и узнаю о Apply, сейчас. По крайней мере, я знаю, что есть решение. Я придерживаюсь Javascript, чтобы получить основу, прежде чем использовать jQuery и т. Д.
  • 0
    @ Райан В моем ответе нет ничего, кроме javascript;)
Показать ещё 1 комментарий
1

Да, вы не можете обменять список параметров для строки, разделенной запятыми. Вы должны использовать структуру данных для их хранения, например массив или объект. Вот пример того, как он будет работать с объектом.

var theme01 = { topp: '#222', bott: '#000', txt: 'wheat' };
function setTheme ( options ) {
    document.getElementById("svg_20").style.fill = options.topp;
    document.getElementById("svg_1").style.fill = options.bott;
    document.getElementById("svg_3").style.fill = options.txt;
}
setTheme( theme01 )
  • 0
    Спасибо за быстрый ответ, это здорово :)
0

Вы можете передать его как массив с использованием синтаксиса распространения, однако вы не можете передать строку элементов и иметь их несколько параметров.

function setTheme(topp, bott, txt, hlin, vlin, fOrb, sOrb) {
  console.log(topp)
  console.log(bott)
  console.log(txt)
  console.log(hlin)
  console.log(vlin)
  console.log(fOrb)
  console.log(sOrb)
}

let items = ['#222', '#000', 'wheat', 'red', 'wheat', 'none', 'none']


setTheme(...items)
  • 0
    Большое спасибо.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню