v8 mixins - created() not called - what am I doing wrong?
See original GitHub issueI’m using 8.0.0-rc.1.
I have this simple .vue file component. When AppTest is rendered in the DOM, I’m not seeing “hello from mixin!” in the console. Is there something off with this syntax below?
<template>
<div>
Hello World
</div>
</template>
<script lang="ts">
import { Vue, mixins } from 'vue-class-component';
class MyMixin extends Vue {
created() {
this.hello();
}
hello() {
console.log('hello from mixin!');
}
}
export default class AppTest extends mixins(MyMixin) {}
</script>
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (1 by maintainers)
Top Results From Across the Web
Hook functions defined by mixin not called for third-party ...
I'm extending Vue components globally with a mixin: Vue.mixin({ mounted() { console.log('Component mounted'); } });. I see the log above for all ...
Read more >New way to define props and emits options #447 - GitHub
import { props, emits, mixins } from 'vue-class-component' // Define component ... Since decorators do not modify the original class type, ...
Read more >Writing Media Queries with Sass Mixins | by Timothy Robards
Media queries are one of the techniques we can use to help ensure our layouts ... Sass mixins give us the ability to...
Read more >Understanding Mixins in Vue JS - Bits and Pieces
Mixins in Vue JS are basically a chunk of defined logic, stored in a particular prescribed way by Vue, which can be re-used...
Read more >Change: Don't use Vue Mixins (#32) · Issues - GitLab
Reasons: Non-obvious code. using a mixin means you have a magic this.something in a component, and you cannot easily tell what it is....
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@Kapcash I’m talking about vue-class-component 8.0.0-rc.1 for Vue 3, not the old one for Vue 2.
The
@Component
decorator no longer exists in this version, it is replaced by@Options
, which is optional.You have to use the
@Component
decorator on your mixin, or it won’t be considered as a Vue component Mixin. This is a common mistake I used to do when I started using this library 😃Also, you don’t need to use the
mixins()
helper when you have only one extend:export default class AppTest extends MyMixin {}