21. State management

1. Все данные — только в моделях

Не храните данные во value и других свойствах контроллов. Все данные приложения должны храниться в моделях:

  • Для серверных данных используйте ODataModel и явно привязывайте компоненты к нему.
  • Для локальных/временных данных используйте JSONModel.

Пример:

// Привязка к ODataModel
this.getView().setModel(this.getOwnerComponent().getModel("mainOData"));

// Локальная модель для страницы
const oLocalModel = new sap.ui.model.json.JSONModel({
    filter: "",
    isBusy: false,
    items: []
});
this.getView().setModel(oLocalModel, "view");

2. На каждую страницу — отдельный JSONModel

Для каждой страницы/вьюхи создавайте отдельный именованный JSONModel для локальных данных. Это облегчает дебаг: вся структура состояния видна как JSON, можно быстро подменить данные через дебаггер.

Пример:

// В onInit контроллера
this.getView().setModel(new JSONModel({
    search: "",
    selected: null,
    table: []
}), "view");

3. Явная инициализация структуры модели

Всегда инициализируйте всю структуру модели в onInit. Не добавляйте новые параметры динамически в рантайме — это усложняет поддержку и дебаг.

Пример:

// Плохо:
this.getView().getModel("view").setProperty("/newField", 123); // динамически

// Хорошо:
this.getView().setModel(new JSONModel({
    newField: 123
}), "view");

4. Бизнес-логика — только через модели

Избегайте обращения к контроллам по id (this.byId(...)). Вся бизнес-логика должна работать с данными в моделях, а не напрямую с контроллами.

Пример:

// Плохо:
const value = this.byId("input").getValue();

// Хорошо:
const value = this.getView().getModel("view").getProperty("/inputValue");

5. EventBus — только для событий

Используйте EventBus только для передачи событий между независимыми компонентами. Не используйте его для передачи данных.

6. URL-параметры для передачи состояния между страницами

Для передачи состояния между страницами используйте параметры роутера (query/hash). Не передавайте большие объёмы данных через URL.

Пример:

this.getRouter().navTo("detail", { id: selectedId });

7. Типизация моделей в TypeScript

В TypeScript-проектах явно описывайте тип объекта для JSONModel:

type ViewModel = {
    search: string;
    selected: number | null;
    table: any[];
};
const model = new JSONModel({} as ViewModel);

Вывод

  • Все данные — только в моделях (ODataModel/JSONModel)
  • На каждую страницу — отдельный именованный JSONModel
  • Явная инициализация структуры модели
  • Бизнес-логика работает только с моделями
  • EventBus — только для событий
  • Для TypeScript — типизация моделей
  • Для передачи состояния между страницами — только URL-параметры

См. также