HTML-aanbiedingen renderen zonder kiezers
Gebruik dit patroon wanneer uw voorstellingen HTML-inhoud bevatten, maar u moet opgeven waar u deze wilt toepassen (kiezer) en hoe u deze wilt toepassen (handelingstype). U kunt dit doen door applyPropositions aan te roepen met een metadata -object dat via bereik is vergrendeld. Ondersteunde actionType -waarden zijn setHtml , replaceHtml en appendHtml .
1. flikkering beheren (optioneel)
Als u inhoud verbergt tijdens het renderen, bent u er verantwoordelijk voor dat de inhoud wordt weergegeven nadat het renderen is voltooid. Zie flikkering voor meer informatie beheren.
2. Vraag voorstellen aan voor het bereik dat u wilt renderen
alloy("sendEvent", {
personalization: {
decisionScopes: ["discount", "salutation"]
},
xdm: { }
}).then(({ propositions = [] }) => {
// Render in the next step
});
Zie personalization.decisionScopes voor meer informatie.
3. Aanbiedingen renderen met applyPropositions metagegevens
alloy("sendEvent", {
personalization: {
decisionScopes: ["discount", "salutation"]
},
xdm: { }
}).then(({ propositions = [] }) => {
return alloy("applyPropositions", {
propositions,
metadata: {
salutation: {
selector: "#salutation",
actionType: "setHtml"
},
discount: {
selector: "#daily-special",
actionType: "replaceHtml"
}
}
}).then(({ propositions: renderedPropositions = [] }) => {
return { renderedPropositions };
});
});
4. Registreer weergavegebeurtenissen voor gerenderde voorstellingen
Weergavegebeurtenissen worden niet automatisch verzonden wanneer applyPropositions wordt aangeroepen. Nadat het renderen is voltooid, gebruikt u een sendEvent -aanroep die verwijst naar de gerenderde voorstellingen:
function toDisplayPayload(propositions) {
return propositions.map((p) => ({
id: p.id,
scope: p.scope,
scopeDetails: p.scopeDetails
}));
}
alloy("sendEvent", {
personalization: {
decisionScopes: ["discount", "salutation"]
},
xdm: { }
}).then(({ propositions = [] }) => {
return alloy("applyPropositions", {
propositions,
metadata: {
salutation: { selector: "#salutation", actionType: "setHtml" },
discount: { selector: "#daily-special", actionType: "replaceHtml" }
}
}).then(({ propositions: renderedPropositions = [] }) => {
return alloy("sendEvent", {
xdm: {
_experience: {
decisioning: {
propositions: toDisplayPayload(renderedPropositions),
propositionEventType: { display: 1 }
}
}
}
});
});
});
Zie vertoningsgebeurtenissen voor meer informatie beheren.
sendEvent vraag.5. Opnieuw renderen
Als de implementatie later opnieuw moet worden gerenderd (bijvoorbeeld in toepassingen met één pagina), roept u applyPropositions nogmaals aan met dezelfde voorstellingen en metagegevens:
alloy("applyPropositions", {
propositions,
metadata: {
discount: { selector: "#daily-special", actionType: "replaceHtml" }
}
});
Als u een vertoningsgebeurtenis voor dat moet registreren re-geef terug, zie vertoningsgebeurtenissen leiden.