Docs for button and splitbutton
parent
9fd68309a4
commit
8efd5dd719
|
@ -20,7 +20,7 @@ import Button from 'primevue/button';
|
|||
</CodeHighlight>
|
||||
<h3>Icons</h3>
|
||||
<p>Icon on a button is specified with <i>icon</i> property and position is configured using <i>iconPos</i> attribute. Default
|
||||
icon position is "left" and alternative is "right". To display only an icon, leave label as undefined.</p>
|
||||
icon position is "left" and alternative is "right". To display only an icon, leave the label as undefined.</p>
|
||||
<CodeHighlight>
|
||||
<Button label="Click" icon="pi pi-check" iconPos="right" />
|
||||
</CodeHighlight>
|
||||
|
@ -58,35 +58,36 @@ import Button from 'primevue/button';
|
|||
</CodeHighlight>
|
||||
|
||||
<h3>Properties</h3>
|
||||
<p>Any valid attribute such as style and class are passed to the underlying input element. Following are the additional properties to configure the component.</p>
|
||||
<div class="doc-tablewrapper">
|
||||
<table class="doc-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>label</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Text of the button.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>icon</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Name of the icon.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>iconPos</td>
|
||||
<td>string</td>
|
||||
<td>left</td>
|
||||
<td>Position of the icon, valid values are "left" and "right".</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>label</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Text of the button.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>icon</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Name of the icon.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>iconPos</td>
|
||||
<td>string</td>
|
||||
<td>left</td>
|
||||
<td>Position of the icon, valid values are "left" and "right".</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
|
|
@ -52,6 +52,48 @@ export default {
|
|||
<SplitButton label="Save" icon="pi pi-plus" :model="items"></SplitButton>
|
||||
</CodeHighlight>
|
||||
|
||||
<h3>MenuModel</h3>
|
||||
<p>SplitButton items are based on the PrimeVue MenuModel API.</p>
|
||||
|
||||
<div class="doc-tablewrapper">
|
||||
<table class="doc-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Type</th>
|
||||
<th>Default</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>label</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Text of the menuitem.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>icon</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Icon of the menuitem.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>url</td>
|
||||
<td>object</td>
|
||||
<td>null</td>
|
||||
<td>External link to navigate when item is clicked.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>command</td>
|
||||
<td>boolean</td>
|
||||
<td>false</td>
|
||||
<td>Callback to execute when item is selected.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h3>Severity</h3>
|
||||
<p>Different color options are available as severity levels.</p>
|
||||
|
||||
|
|
Loading…
Reference in New Issue