Вступ до Behaviors
У цьому пості ви дізнаєтеся про нову фічу Marionette.js - Behaviors.
Behaviours надає інтерфейс для ізолювання описів взаємодії DOM з користувачем окремі логічні шматки коду. Behaviour може бути застосовано до будь-якого View будь-яку кількість разів.
У цій статті я розглядатиму найтривіальніший приклад — кнопка «Видалити».
Як описуються Behaviors і де вони зберігаються?
Для того, щоб користуватися Behaviors, треба спочатку вказати Marionette де вони зберігаються. Це робиться так
Ви можете змінити місце зберігання. Після того, як необхідне налаштування проведено, можна розпочати створення нашого Behavior.
Опис функцій
Щоб створити новий шаблон поведінки, треба розширити Backbone.Marionette.Behavior.
Чим можна розширювати цей об'єкт? Ми можемо слухати події моделі чи колекції, прив'язаної до виду, до якого застосовано цей шаблон.
З View до Behavior можна передавати options. Вони ми можемо передати будь-що, наприклад клас елемента, при кліку який треба щось видалити. Також можна слухати події виду, до якого ми його застосуємо. Зверніть увагу, що контекст функцій тут не вигляд, до якого застосований шаблон, а сам шаблон. Щоб звертатися до виду, ви можете використовувати this.view. Також доступні this.$ та this.$el.
Якщо треба визначити якісь опції, робимо так
Це працює за аналогією з defaults у моделей.
Створюємо Behavior
Як я вже казав, як приклад я використовуватиму кнопку видалення. Зверніть увагу, що новий шаблон поведінки має бути властивістю об'єкта, вказаного нами маріонеткою як сховище.
Отже, мистворили Behavior, назвали його CloseButton. Що він робить? Він слухає подію Render, і коли вона сталася, вішає обробник на клік елементом. А який саме елемент? Він бере його з options. За умовчанням це елемент із класом .remove-this, тобто така кнопка цілком зійде
Після того, як шаблон готовий, можна застосовувати його до View.
У вигляді Product ми передали Behavior з опцією, яка перевизначить елемент кліка.
Ось так за допомогою Behaviors ми уникли дублювання коду і зробили світ кращим.