html - 如何在 Svelte 中有条件地禁用字段？

Question

在 Angular 2+（例如）中，我可以使用此语法有条件地禁用字段：

<input [disabled]="booleanCondition" type="text">

在 Svelte 中，我尝试执行以下操作，但它不起作用：

<input {booleanCondition ? 'disabled=""' : ''} type="text">

我该怎么做？

Answer 1

像这样：

<input disabled={booleanCondition}>

Answer 2

我将添加到已接受的答案中，即可以传递一个外部（相对于组件）布尔值，如下所示：

<!-- Nested.svelte -->
<input disabled={ $$props.disabled }>

<!-- App.svelte -->
<Nested disabled={ booleanCondition }/>

概括该方法：

<!-- Nested.svelte -->
<script>
const { type, name, required, disabled } = $$props
</script>
<input { type } { name } { required } { disabled }> 

<!-- App.svelte -->
<Nested type="text" name="myName" required disabled={ booleanCondition }/>