Access instance via methods inside a custom Vue component

I'm trying to access the instance methods/data through a triggered method inside a custom registered Vue component.

Below a basic example:

Vue.component('example-component', {
        template: `<div>
                        <h2>Count: {{count}}</h2>
                        <button class="btn btn-primary" v-on:click="increment()">Increment</button>
                    </div>`,
        data: () => {
            return {
                count: 0
            }
        },
        methods: {
            increment: () => {
                console.log("Click!");
                console.log("Current count: ", this.count);
                this.count++;
                console.log("New count: ", this.count);
            },
            decrement: () => {
                // other function
            }
        },
        mounted: () => {
            console.log("Example component mounted!");
        }
    });

Results:

Example component mounted!
Click!
Current count:  undefined
New count:  NaN

As you might notice the property 'count' has been loaded during the component mount and is available/rendered inside the HTML. The method 'increment()' has also been triggered. However, 'this.count' seems to be unreachable like possible other methods (e.g. 'this.decrement()') which will throw a TypeError this.decrement is not a function.

Any suggestions if this approach is even possible?

PS. I'm aware of the default approach via a .vue file registery like:

Vue.component('example-component', require('./components/ExampleComponent.vue').default);