Skip to main content
Módulo Vuex que gerencia o estado do Editor de Código. Detecta se a loja está sendo visualizada dentro do iframe do editor, bloqueia navegação em modo preview e escuta mensagens do editor para atualizar parâmetros em tempo real.

​
Getters

GetterTipoDescrição
isPreviewBooleantrue quando a página está sendo visualizada em modo preview (?preview=true).
isIframeBooleantrue quando a página está rodando dentro do iframe do editor de temas.
activeSectionStringAlias da seção atualmente selecionada no editor.

​
Actions

ActionParâmetrosDescrição
load—Inicializa os listeners de clique em links para o modo preview e iframe.
focusOnSectionsection: StringFaz scroll até a seção com a classe correspondente ao alias informado.
updateParamsparams: ArrayRecebe parâmetros do editor e notifica o iframe pai para limpar os params.
setActiveSectionsection: StringDefine a seção ativa no editor.

​
Uso

import { mapGetters } from 'vuex';

export default {
    computed: {
        ...mapGetters('preview', ['isIframe', 'isPreview']),
    },

    methods: {
        handleAction() {
            // Bloqueia ações que não devem ocorrer dentro do editor
            if (this.isIframe) return;

            this.$redirectTo('/checkout');
        },
    },
};