Javascript 在敲除样式绑定中使用CSS3变量

我试图使用knockout添加到一些

div

元素中，然后在CSS中使用这些元素来计算最终的样式

例如：

var viewModel=函数viewModel（）{
this.randomColor=ko.computed（函数（）{
//随机颜色感谢@paul_irish
返回“#”+Math.floor（Math.random（）*16777215）.toString（16）；
});
}();
应用绑定（视图模型）
h2{
/*默认后退颜色：*/
--随机颜色：#666；
颜色：var（--随机颜色）；
}

这应该会收到一个随机的文本颜色。
如果不增加敲除功能，现在看来这是不可能的

考虑现在如何在此处的源中操作样式绑定：

特别是这一行：

 element.style[styleName] = styleValue;

无论何时运行，
styleName
都将是CSS变量
“--random color”

但是，您不能通过
元素.style[“--random color”]
设置样式。你必须通过

还考虑这个问题：


如果您现在需要此功能，可以加载敲除库脚本，然后覆盖
ko.bindingHandlers['style']。更新
函数以使用将使用
setProperty（）
的版本：


我已经在淘汰版GitHub上添加了一个问题，以防其他更好的答案出现：。
查看来源，如果没有pull请求，我认为这将不会得到很好的支持：。这似乎是camel cases样式属性的一条线，但是看起来，
--
将被正则表达式吃掉……我真的不喜欢它的外观，我在GitHub上对此进行了跟踪。你可以在这里找到它：。也许这个问题会带来一个更好的方法。您不需要fork Knockout来添加绑定处理程序。@MichaelBest您可以添加how作为答案吗？我同意，如果你可以覆盖默认行为，那么分叉就太过致命了。在包含淘汰库之后，请包含上面的代码。然后，您将用自己的绑定处理程序替换
样式
绑定处理程序。@MichaelBest您是对的，这是一个更好的临时解决方案。
ko.bindingHandlers['style'] = {
    'update': function (element, valueAccessor) {
        var value = ko.utils.unwrapObservable(valueAccessor() || {});
        ko.utils.objectForEach(value, function(styleName, styleValue) {
            styleValue = ko.utils.unwrapObservable(styleValue);

            if (styleValue === null || styleValue === undefined || styleValue === false) {
                // Empty string removes the value, whereas null/undefined have no effect
                styleValue = "";
            }

            if(styleName.substring(0, 2) === "--"){
                element.style.setProperty(styleName, styleValue);
            } else {
                element.style[styleName] = styleValue;
            }
        });
    }
};