NativeScript-Vue 2.0: Back to the Vueture (Webinar) is now on YouTube
ActionItem

This is an overview of the most common usage of ActionItem. For more information about the available properties, methods, or events, head over to the complete API documentation for ActionItem.

ActionItem组件用于向ActionBar添加其他操作按钮。


<ActionBar title="My App">
  <ActionItem @tap="onTapShare"
    ios.systemIcon="9" ios.position="left"
    android.systemIcon="ic_menu_share" android.position="actionBar" />
  <ActionItem @tap="onTapDelete"
    ios.systemIcon="16" ios.position="right"
    text="delete" android.position="popup" />
</ActionBar>

有条件地显示行动项目

ActionItems可以根据条件使用 v-show 指令显示 。

<ActionBar title="My App">
  <ActionItem @tap="onTapEdit"
    v-show="!isEditing"
    ios.systemIcon="2" ios.position="right"
    android.systemIcon="ic_menu_edit" />
  <ActionItem @tap="onTapSave"
    v-show="isEditing"
    ios.systemIcon="3" ios.position="right"
    android.systemIcon="ic_menu_save" />
  <ActionItem @tap="onTapCancel"
    v-show="isEditing"
    ios.systemIcon="1"
    android.systemIcon="ic_menu_close_clear_cancel" />
</ActionBar>

道具

名称类型描述
ios.systemIconString设置iOS的图标。
android.systemIconString设置Android的图标。
ios.positionString设置iOS的位置。
可能的值:
- left (默认值):将项目放在ActionBar的左侧。
- right:将项目放在ActionBar的右侧。
android.positionString设置Android的位置。
可能的值:
- actionBar (默认值):将项目放在ActionBar中。
- popup:将项目放在选项菜单中。项目将呈现为文本。
- actionBarIfRoom:如果有足够的空间,将项目放在ActionBar中。否则,将其放在选项菜单中。

活动

名称描述
tap已触发ActionItem时发出。
Contributors