V1 Actionsheet vue close event

Few questions about f7 v1 vue
i want to open action sheet when clciking a button , so used the below code
<f7-actions :opened="actionOpened"> first time it opens when button is clicked, and i f i click outside the actionsheet , it closes but i cant set the opened=“false”, how to trigger the close event in vue ?
in the doc the event is listed as actions:closed but do not know how to use this ?
please help

  <f7-actions :opened="actionOpened">
  <!-- Actions Group -->
  <f7-actions-group>
    <!-- Actions Label -->
    <f7-actions-label>Confirm</f7-actions-label>
    <!-- Actions Buttons -->
     
    <f7-actions-button @click="deleteClass1" close="false">Delete</f7-actions-button>
  </f7-actions-group>
  <!-- Another Group -->
  <f7-actions-group>
    <!-- Cancel/Close Button -->
    <f7-actions-button color="red" close="false"
                       bold>Cancel</f7-actions-button>
  </f7-actions-group>
</f7-actions>

if i click outside actionsheet

<f7-actions :opened="actionOpened" @actions:closed="actionOpened=false">
1 Like

Thank you for the clarification, i solved thsi by its js way

mounted() {
    document.addEventListener('actions:closed', () => {
      this.actionOpened = false
    })
}
1 Like