Knockoutjsobservable和jQuery扩展了函数

Knockoutjs observable and jQuery extends function

本文关键字：函数 扩展 jQuery Knockoutjsobservable      更新时间：2024-03-12

假设我有以下代码：

var Klass = function(){
  var self = this;
  this.value = 123;
  this.update = function(){
    $.ajax({
      url: '/whatever', 
      async: false,
      success: function(data){
        $.extend(self, data);
      }
    });
  }
}

让我们假设，'/whatch'返回这个json对象：

{value: 234}

当我这样做的时候：

var obj = new Klass();
obj = ko.mapping.fromJS(obj);
console.log(obj);

我们都知道obj现在是一个可以观察到的敲除js。

我运行这个：

obj.update();
console.log(obj);

我发现，obj的值并没有被重写为一个简单的值234，而是保持为一个可观察的属性。

我的问题是：

1） 为什么会这样？

2） 我如何使更新按我的意愿工作。

更新：ajax调用不是异步的。

第一个问题是您正在扩展self，它是一个作用域变量，只存在于Klass函数内部，而不是您通过调用它创建的实例。

如果在调用update时需要覆盖value，则需要调用$.extend(this, data);。尽管我确实理解你为什么在那里使用self。但是通过调用ko.mapping.fromJS添加的observable功能随后丢失。CCD_ 10不再是函数（ko observable）而是标量值（234）。您必须再次调用obj = ko.mapping.fromJS(obj);才能将值包装为observable。

第二个问题是$.get是异步的，所以在调用obj.update之后立即调用console.log(obj)将在GET响应到来之前记录该值。您需要等待它执行（使用回调）。

这是一把正在工作的小提琴。

var Klass = function(){
  this.value = 123;
  this.update = function(callback){
      var self = this;
      $.get('/', function(data) {
          $.extend(self, {value: 234});
          callback.call(undefined);
      });
  }
}
var obj = new Klass();
obj = ko.mapping.fromJS(obj);
console.log(obj.value());
obj.update(function() {
    obj = ko.mapping.fromJS(obj);
    console.log(obj.value());
});
相关文章：