IconField は入力フィールドとアイコンをラップします。
import IconField from 'primevue/iconfield';
import InputIcon from 'primevue/inputicon';
IconField は InputIcon と入力フィールドコンポーネントをラップします。
<IconField>
<InputIcon class="pi pi-search" />
<InputText v-model="value1" placeholder="Search" />
</IconField>
<IconField>
<InputText v-model="value2" />
<InputIcon class="pi pi-spin pi-spinner" />
</IconField>
InputIcon 内のカスタムコンテンツは子として定義されます。
<IconField>
<InputIcon>
<svg width="35" height="40" viewBox="0 0 35 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="..." fill="var(--p-primary-color)" />
<path d="..." fill="var(--p-text-color)" />
</svg>
</InputIcon>
<InputText v-model="value" placeholder="Search" />
</IconField>
IconField と InputIcon はロールと属性を必要としません。
コンポーネントにはインタラクティブな要素は含まれていません。