Adding eventlistener on mounted()?

I want to add an event listener to a component
What’s the best way to do this?

I’m using mounted(), but obviously every time I open the component, the same event listener gets added again.

mounted() {
        'trainingAdded', (rec) => {

You can (and should) use created instead.

Aside from @phanan 's hint:

That’t normal. You should simply use the destroyed()hook to remove the listener when the component is destroyed;

created() {
  Events.on('trainingAddded', this.handler)
destroyed() {'trainingAddded', this.handler) // assuming removes the listener.
methods: {
  handler(rec) {
    // ...