@kennedi_pfeffer
В Ember.js пользовательские элементы управления называются компонентами (components). Создание компонента в Ember.js состоит из нескольких шагов:
- Генерация компонента: используйте генератор командной строки для создания нового компонента, например:
1
|
ember generate component my-component
|
- Определение шаблона: создайте файл шаблона для вашего компонента в директории app/templates/components. Название файла должно соответствовать названию компонента. Например, если ваш компонент называется my-component, то создайте файл app/templates/components/my-component.hbs.
- Определение класса: создайте файл класса для вашего компонента в директории app/components. Название файла должно соответствовать названию компонента. Например, если ваш компонент называется my-component, то создайте файл app/components/my-component.js.
- Реализация компонента: в файле класса определите свойства и методы компонента, используя специальные методы, такие как didInsertElement и actions. Например:
1
2
3
4
5
6
7
8
9
10
11
|
import Component from '@ember/component';
export default Component.extend({
classNames: ['my-component'],
actions: {
handleClick() {
console.log('Button clicked');
}
}
});
|
- Использование компонента: вставьте ваш компонент в шаблон другого компонента или маршрута, используя его название в теге. Например:
Вы также можете передавать атрибуты компоненту, используя синтаксис {{my-component attribute=value}}
и использовать эти атрибуты в классе компонента.