javascript - 函数在控制台中正确执行，但在代码中不正确

Question

我正在使用 less.js 中的 less.modifyVars() 函数。

在控制台中，我可以这样做:

less.modifyVars({ '@body-bg' : 'black' });

它会重新编译 less，为页面提供黑色背景。所以效果很好。

然后我在代码中尝试:

$scope.variableChange = function(selectedVariable) {
    var slug = "'" + selectedVariable.slug + "'";
    var value = "'" + selectedVariable.value + "'";
    less.modifyVars({ slug : value });
};

现在，我可以看到 less.modifyVars() 函数确实执行了，因为我在控制台中收到了通知，但它似乎没有传递正确的值。所以我在variableChange函数中添加了一个console.log:

console.log(slug + ":" + value);

然后我得到控制台输出:

'@body-bg':'black' 

这应该意味着 less.modifyVars() 函数的执行方式为:

less.modifyVars({ '@body-bg' : 'black' });

但是我没看到。这里有什么问题吗？

Answer 1

您制作对象的方式是错误的

您正在设置的是

{ "slug" : "'black'" }

您不能将变量设置为这样的键，并且不需要添加额外的引号，您只需向字符串添加引号即可。

只需创建一个对象，添加一个键，设置值。

var obj = {};
obj[selectedVariable.slug] = selectedVariable.value;
less.modifyVars(obj);