同一个绑定中的 KnockoutJS css 和 class

Question

Despite the section in https://knockoutjs.com/documentation/css-binding.html i wasnt able to use css and class together, instead I could use two different css bindings: http://jsfiddle.net/g9sot5qb/

我做错了什么还是文档不准确？

<span class="cls1 cls2" data-bind="text: title,css: {active: active}, class: myClass" ></span>
<span class="cls1 cls2" data-bind="text: title,css: {active: active}, css: myClass" ></span>

Answer 1

class绑定是 Knockout 3.5版功能。

从 v 3.5发行说明：

新的 class 绑定支持动态 class 字符串。
这允许您一起使用 css 和 class 绑定来支持设置 CSS 类的两种方法。

---

您的 jsfiddle 使用的是旧版本。

另请注意， observable active必须具有true值才能应用css class 'active' 。

请参阅下面的（可运行）示例，其中class和css绑定都处于活动状态。

 var viewModel= { myClass: ko.observable('test'), title: ko.observable('Title'), active: ko.observable(true) }; ko.applyBindings(viewModel);

 .test{ color: red }.active { font-size: 32px; }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.5.0/knockout-min.js"></script> <span class="cls1 cls2" data-bind="text: title, css: {active: active}, class: myClass" ></span>