Picker Modal is a special overlay type which is similar to Picker/Calendar's overlay. Such modal allows to create custom picker overlays with custom content.
Picker Modal Vue component represents Picker Modal component.
<!-- Picker Modal --> <f7-picker-modal> <!-- Picker Modal content goes here --> </f7-picker-modal>
<!-- Picker Modal --> <div class="picker-modal"> <div class="picker-modal-inner"> <!-- Picker Modal content goes here --> </div> </div>
|overlay||boolean||Enable to render additional picker modal overlay when required|
|theme||string||Picker Modal theme color. One of default colors|
|layout||string||Picker Modal layout theme. One of default layout themes|
|opened||boolean||Allows to open/close Picker Modal and set its initial state|
|.open(animated)||Open picker modal|
|.close(animated)||Close picker modal|
|picker:open||Event will be triggered when Picker Modal starts its opening animation|
|picker:opened||Event will be triggered after Picker Modal completes its opening animation|
|picker:close||Event will be triggered when Picker Modal starts its closing animation|
|picker:closed||Event will be triggered after Picker Modal completes its closing animation|
You can control Picker Modal state, open and closing it: