淘汰：为什么我的计算函数会自动将项目推送到我的可观察数组中？

Posted 2021-05-05

我有一个计算函数，它从websocket调用中获取数据并将其推送到我的可观察数组中

onlineFriends.friendIsOnline = ko.computed(function () {

    socket.on('friend joined', function(data) {

        console.log(data);

        var newObservableItem = onlineFriends.friend(data);

        console.log(newObservableItem);

        onlineFriends.friendsOnline.push(newObservableItem);

        console.log(onlineFriends.friendsOnline())


    });

});

这是将其转换为observable的函数：

onlineFriends.friend = function(data) {

    var self = this;

    self.country = ko.observable(data.country);

    self.firstName = ko.observable("oto");

    self.userName = ko.observable(data.username);

    self.id = ko.observable(data.id);

    self.picture = ko.observable(data.picture);

    self.hasInitMessage = ko.observable(false);

    self.messages =  ko.observableArray([]);

    return self;


};

这是我从套接字监听器收到的数据：

{“firstName”：“Mfon”，“id”：“2”，“地址”：“vgc”，“bio”：“一个男人每天至少要下一次赌注，否则他可能会幸运地走来走去，永远不会知道它。“，”country“：”澳门特别行政区“，”电子邮件“：”mfon @ gmail.com“，”名字“：”Mfon“，”性别“：”女性“，”姓氏“：”Ukim“， “锁定”：假的， “钱”：0， “onlinestatus”： “在线”， “密码”： “mfon”， “PHONENUMBER”： “08023182388”， “图片报”： “仿制avatar.jpg”，“用户名“：” mfon”， “用户类型”： “PLAYER”}

来自套接字的数据应该被转换为一个observable并在Observable数组中推送，但是数据本身与新的可观察数据一起被推入可观察数组，使得我的可观察数组中存在的项目，为什么这样？

答案

那是因为你的friend()方法没有返回你的想法。你打算将它作为一个“friendFactory”，但它返回整个onlineFriends数组，那是因为你的this指的是onlineFriends数组。

尝试将您的方法更改为更像工厂/映射到可观察的方式：

onlineFriends.makeFriend = function(data) {
    return {
        country: ko.observable(data.country),
        firstName: ko.observable("oto"),
        userName: ko.observable(data.username),
        id: ko.observable(data.id),
        picture: ko.observable(data.picture),
        hasInitMessage: ko.observable(false),
        messages: ko.observableArray([])
    };
};

然后在你的套接字监听器中：

var newObservableItem = onlineFriends.makeFriend(data);
onlineFriends.friendsOnline.push(newObservableItem);