Etapa 8: Executar Ações

No final deste tópico, você poderá soltar na página os componentes que executem ações internas. Isso utiliza o registro de ação que você criou na etapa anterior.

Para que um componente execute uma ação, ele deve fazer listening da mensagem EXECUTE_ACTION. Essa mensagem também inclui o payload transmitido à ação da qual você extrairá os valores esperados.

Para fazer listening da mensagem EXECUTE_ACTION, edite o arquivo render.js e atualize o objeto SampleComponentViewModel com a seguinte entrada:

SitesSDK.subscribe('EXECUTE_ACTION', $.proxy(self.executeActionsListener, self));

Quando a mensagem EXECUTE_ACTION é recebida, a função de callback associada é executada:

    self.executeActionsListener = function (args) {
      // get action and payload
      var payload = args.payload,
      action = args.action;

      // handle 'setImageWidth' actions
      if (action && action.actionName === 'setImageWidth') {
        $.each(payload, function(index, data) {
          if (data.name === 'imageWidth') {
            self.imageWidth(data.value);
          }
        });
      }
    }

Isso cria uma função JavaScript para executar a ação e depois usa o Sites SDK para chamar a função sempre que a mensagem EXECUTE_ACTION é emitida.

O componente será chamado sempre que uma mensagem EXECUTE_ACTION for emitida e caberá ao componente tratar apenas as ações designadas a ele. Para fazer isso, verifique o nome da ação para ter certeza de ser uma que o componente pode tratar.

O payload da ação é um array de valores. Normalmente, você precisará encontrar no array os valores de payload do seu interesse.