Usage with Frameworks

The Emarsys Design System is designed in a framework agonistic way to support all frontend development tools. However there are a few things to watch out for when developing with a frontend framework such as Vue.js or Angular.

Component cloning

Some components (e.g. Rule Builder) in the Design System work by cloning their original contents and using the clone for rendering the UI. Cloning components result in losing information on the cloned elements, such as event listeners and properties that are set through the JavaScript API.

In order to avoid losing properties when cloning an element, you should set these properties as attributes instead. In Vue.js 3 use the :value.attr="" syntax, in Angular use [attr.value]="".