条件字段

功能特性

• ✅ 配置驱动的条件显示
• ✅ 支持多种条件类型
• ✅ 级联条件字段
• ✅ 自动状态管理
• ✅ 无需手动 if 判断

配置方式

// 方式1：简单值匹配
{
  name: 'creditCard',
  showWhen: {
    field: 'paymentMethod',
    is: 'credit'
  }
}

// 方式2：值不等于
{
  name: 'otherReason',
  showWhen: {
    field: 'reason',
    isNot: 'none'
  }
}

// 方式3：验证状态
{
  name: 'nextStep',
  showWhen: {
    field: 'email',
    isValid: true,    // 邮箱验证通过
    isTouched: true   // 且已经触摸过
  }
}

// 方式4：自定义匹配
{
  name: 'discount',
  showWhen: {
    field: 'total',
    matches: (value) => value > 100
  }
}

// 方式5：复杂条件（使用 condition 函数）
{
  name: 'special',
  condition: (values) => {
    return values.type === 'A' &&
           values.level > 5 &&
           !values.disabled;
  }
}

优势对比

{#if orderType === 'physical'}
  <Field name="address" />
  {#if deliveryMethod !== 'pickup'}
    <Field name="shippingAddress" />
  {/if}
{:else if orderType === 'digital'}
  <Field name="email" />
  {#if emailValid}
    <Field name="phone" />
  {/if}
{/if}

<Form schema={formSchema} />

// Schema 中配置
{
  name: 'shippingAddress',
  showWhen: {
    field: 'deliveryMethod',
    isNot: 'pickup'
  }
}