无法写入在 knockoutjs 组件内部作为参数接收的可观察对象

Question

当我们将它作为参数传递时，KO 组件会收到一个 observable 的引用。当 componentes 收到它作为参考时，你可以写入这个 observable，它会反映在你的 viewmodel 上；但是，当您使用 ko-es5 插件（超级棒）时，您的 KO 组件不会接收到对您的 observable 的引用，而是接收某种 computeObservable，我们无法写入它。这是意外行为吗？

尝试只使用敲除

http://jsfiddle.net/kapuca/k0fw8w18/

<voting params="votes: votes"></voting>

<template id="voting-tpl">
    <button data-bind="click: increment ">Up</button>
    <div data-bind="text: votes"></div>
</template>

ko.components.register('voting', {
    viewModel: function(params) {
        var self        = this;
        self.votes      = params.votes;

        self.increment  = function(){
            self.votes( self.votes() + 1 );
        };

        return self;
    },
    template: { element: 'voting-tpl' }
});

function Vm(){
    this.votes = ko.observable(5);
    return this;
}

ko.applyBindings(new Vm() );

尝试使用 knockout + ko-es5 插件

http://jsfiddle.net/kapuca/jwea6zaL/

<voting params="votes: votes"></voting>

<template id="voting-tpl">
    <button data-bind="click: increment ">Up</button>
    <div data-bind="text: votes"></div>
</template>

ko.components.register('voting', {
    viewModel: function(params) {
        var self        = this;
        self.votes      = params.votes;

        self.increment  = function(){
            self.votes( self.votes + 1 );
        };

        return ko.track(self);
    },
    template: { element: 'voting-tpl' }
});

function Vm(){
    this.votes = 5;
    return ko.track(this);
}

ko.applyBindings(new Vm() );

Answer 1

我没有使用过 es5 插件，但查看文档您可以使用 ko.getObservable(viewModel, 'propertyName') 访问底层可观察对象。因此，如果您更改您的组件以在其参数中传递底层可观察对象，这似乎绕过了正在发生的任何奇怪情况。

<voting params="votes: ko.getObservable($data, 'votes')"></voting>

您还需要更改增量函数以使用 es5 赋值，而不是像函数那样调用投票 self.votes( self.votes + 1 ); => self.votes += 1;

无法写入在 knockoutjs 组件内部作为参数接收的可观察对象

Cannot write to an observable received as param inside of knockoutjs component

knockout.js

knockout-components

knockout-es5-plugin