Как использовать свойства компонента в Svelte?

Пользователь

от jeromy_ruecker , в категории: JavaScript , 6 месяцев назад

Как использовать свойства компонента в Svelte?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от roma , 4 месяца назад

@jeromy_ruecker 

В Svelte свойства компонента определяются как переменные в разделе <script> компонента. Для использования свойств в разметке компонента можно использовать фигурные скобки {}.


Например, если у нас есть компонент Button, который имеет свойство label, мы можем использовать его следующим образом:

1
2
3
4
5
  export let label = 'Button';


{label}


Здесь мы передали значение 'Button' в свойство label при использовании компонента в другом компоненте или в приложении.


Мы экспортировали свойство label, чтобы его можно было использовать в других компонентах или в приложении. Если свойство не экспортировано, оно будет доступно только внутри компонента.


Также есть возможность указать значения по умолчанию для свойств:

1
2
3
4
5
6
  export let label = 'Button';
  export let disabled = false;


{label}


Здесь мы определили свойство disabled со значением по умолчанию false. Также мы использовали фигурные скобки, чтобы задать значение атрибута disabled кнопки. Если значение свойства disabled будет true, кнопка будет отключена.