В чем разница между setJSON, setData и loadData?

Question

Это касается упомянутых методов sap.ui.model.json.JSONModel в SAPUI5:

• setJSON
• setData
• loadData

В чем разница между этими 3 методами? Когда мы используем эти методы и можем ли мы использовать более 1 из них для одной и той же цели?

Answer 1

Взгляните на хорошо документированный API Reference для JSONModel,

В итоге (из документации SAP):

setData: Устанавливает данные, передаваемые в виде дерева объектов JS, в модель.

например

var data = {
  "ProductCollection": [{
    "titleId": 0,
    "Name": "Olayinka O",
    "ProductId": "001",
    "chartValue": 75,
    "ProductPicUrl": "sap-icon://competitor"
  }]
};


var oModel = new sap.ui.model.json.JSONModel(data);

//OR 
var oModel = new sap.ui.model.json.JSONModel(); 
oModel.setData(data); 


/*setdata, could also be a odata url in json format*/

loadData Загрузка данных в формате JSON с сервера с помощью HTTP-запроса GET и сохранение полученных данных JSON в модели. Примечание. Из-за ограничений безопасности браузера большинство запросов "Ajax" подчиняются одной и той же политике происхождения, поэтому запрос не может успешно извлечь данные из другого домена, субдомена или протокола.

Например, вы можете использовать это для загрузки / получения изменений в данных / модели и автоматически обновляет представление, если эта конкретная модель была привязана путем перезагрузки URL. Если вы используете нагрузку, вам не нужны другие два, по моему мнению и loadData с не работают на локальных данных JSON.

var sURL = "https://cors-anywhere.herokuapp.com/https://services.odata.org/V3/Northwind/Northwind.svc/Products?$format=json";
var oModel = new sap.ui.model.json.JSONModel();

//if called in setInterval, all changes in the backend will be updated in the view if binded in this case every second

setInterval(oModel.loadData(sURL, true), 1000);

setJSON: Устанавливает данные, передаваемые в виде строки в формате JSON, для модели.

то же самое, что и Set Data, но строгий JSON

Answer 2

К счастью, исходный код UI5 вполне читабелен и часто является лучшей документацией, чем большинство описаний API. Вот что каждый из API делает в основном:

setJSON

"Разобрать текст JSON и вызвать setData"

JSONModel.prototype.setJSON = function(sJSON, bMerge) {
    var oJSONData;
    try {
        oJSONData = jQuery.parseJSON(sJSON);
        this.setData(oJSONData, bMerge);
    } catch (e) {
        // ...
    }
};

^{Источник}

УстановитьДанные

"Сохраните данные и оповестите все зависимые привязки (checkUpdate)"

JSONModel.prototype.setData = function(oData/*plain JS object*/, bMerge){
    if (bMerge) {
        this.oData = /* merge with existing data */;
    } else {
        this.oData = oData;
    } // ...
    this.checkUpdate(); // notifies dependent bindings
};

^{Источник}

LoadData

"Загрузить данные с заданного удаленного URL и вызвать setData" -> Пожалуйста, проверьте источник здесь.

---

Короче, все они называют setData в какой-то момент.

Какой API вызывать в какой ситуации зависит от того, в каком формате у вас есть доступные данные.

• Данные в тексте JSON -> setJSON
• Данные где-то еще -> loadData
• У меня уже есть данные в JS объект / массив ---> setData

Answer 3

УстановитьДанные

У вас есть объект JavaScript и вы хотите использовать эти данные в качестве модели

const oJSONData = {
    data: {
        id: 4,
        first_name: "Eve",
        last_name: "Holt",
        avatar: "https://s3.amazonaws.com/uifaces/faces/twitter/marcoramires/128.jpg"
    }
};
oJSONModel.setData(oData);

---

setJSON

У вас есть строка, которая при анализе представляет объект JavaScript, и вы хотите использовать эти данные в качестве модели

const sJSONData = '{"data":{"id":4,"first_name":"Eve","last_name":"Holt","avatar":"https://s3.amazonaws.com/uifaces/faces/twitter/marcoramires/128.jpg"}}';
oJSONModel.setJSON(sJSONData);

---

LoadData

Вы хотите получить доступ к удаленному API, который возвращает данные в виде JSON, и хотите использовать эти данные в качестве модели

const sURL = "https://reqres.in/api/users/4";
oJSONModel.loadData(sURL);