knockout js 页面加载的时候自动执行 click

Question

 <ul class="dropdown-menu color-menu" aria-labelledby="colorLabel" data-bind="foreach: $parent.colors">
     <li data-bind="attr: { class: color },event: {click: $root.changeColor($parent.id,color)}">&nbsp</li>
 </ul>
 
 
   var SettingModel = function () {
       self.colors = ko.observableArray([
            { color: 'bg-green' },
            { color: 'bg-red' },
            { color: 'bg-yellow' },
            { color: 'bg-aqua' }
        ]);
        
         self.changeColor = function (id, color) {
             console.log(id() + "|" + color)
         }
   }
   

在页面加载的时候会自动执行click，每个元素对应的li元素都执行一遍changeColor。不是应该点击了之后再执行吗？

Answer 1

click: $root.changeColor()

后面加了 () 就会执行……

若果要实现带参数的方法，可以考虑匿名的写法。

 <li data-bind="click: function() { $root.changeColor($parent.id,color)},attr: { class: color } ">&nbsp;</li>

Answer 2

我也遇到了同样的问题，我用了$parent.changeColor.bind($parent.id,color)解决的，楼主可以试一下