Bêta

Ces composants App Bridge sont nouveaux et n'ont pas encore été testés dans une vraie interface d'administration Shopify. Pendant la bêta, leur API peut changer dans une version mineure. Si quelque chose ne fonctionne pas, ouvrez une issue.

AppWindow

Avant de commencer, consultez Installation ; pour open, consultez Modal.

AppWindow génère s-app-window, que la documentation de @shopify/app-bridge-types décrit comme "a fullscreen modal window in the Shopify admin". src est obligatoire : "the URL is loaded in an iframe when the window opens".

vue

<script setup lang="ts">
import { ref } from 'vue'
import { AppWindow } from 'polaris-vue-elements/app-bridge'

const open = ref(false)
</script>

<template>
  <button @click="open = true">Edit in bulk</button>
  <AppWindow id="bulk-editor" src="/bulk-editor" v-model:open="open" />
</template>

open, v-model:open, show/hide et le masquage au démontage fonctionnent comme pour Modal. Il n'a pas de slot.

AppWindow ​

AppWindow