Question

学习React Native。尝试将字符串转换为函数名称。收到错误消息“ func不是函数。func未定义”。请需要帮助。最终目标是创建一个具有背景色的视图，并具有用于增加/减少RGB值的按钮

  const [red, setRed] = useState(0);
  const [green, setGreen] = useState(0);
  const [blue, setBlue] = useState(0);

  const setColor = (color, change) => {
    // color === "red", "green", "blue"
    // change === +10, -10
    const colorCapitalized = color.charAt(0).toUpperCase() + color.slice(1);
    var stateMethod = 'set' + colorCapitalized;
    var func = window[stateMethod];

    if (color + change > 255 || color + change < 0) {
      return;
    } else {
      func(color + change);
    }
  };

Answer 1

避免使用setRed对象（或通常使用全局变量）。您当然不能将其与const setters = { red: setRed, green: setGreen, blue: setBlue };之类的局部变量一起使用。

如果您真的想那样做，请将函数放在对象上：

color

然后使用const setter = setters[color]; setter(color + change);对其进行索引：

setters[color](color + change);

甚至

setColor

您也可以对这些值进行相同的操作。这样您的const [red, setRed] = useState(0); const [green, setGreen] = useState(0); const [blue, setBlue] = useState(0); const setters = { red: setRed, green: setGreen, blue: setBlue }; const values = { red, green, blue }; const setColor = (color, change) => { const update = values[color] + change; if (update >= 0 && update <= 255) { setters[color](update); } };就变得简单得多（特别是如果我们只做一次数学运算并重复使用结果）：

setColor

话说，需要setColor似乎很奇怪。您可能会考虑自己是否真正需要它，甚至可能发布一个新问题（不是该问题的更新），并附上您认为为什么需要它的全部内容。，询问您是否可以避免使用NSView.MouseEntered。

Answer 2

如何包装二传手

// do you really need the `color` arg?
const clamped = ([value, setter]) => [value, (color, change) => {
  let w = value + change;
  if(w >= 0 && w < 255) setter(value = w);
}];

const [red, setRed] = clamped(useState(0));
const [green, setGreen] = clamped(useState(0));
const [blue, setBlue] = clamped(useState(0));

将字符串转换为函数名称

2 个答案: