2

When I try this:

createApp(App).mixin({
    methods: {
        myFunction() {
            this.$el.querySelectorAll('input').forEach(...);
        }
    },

    mounted() {
        this.myFunction();
    }
}).mount('#app');

I'm getting a TypeError: this.$el.querySelectorAll is not a function but the weird thing is that everything is working as expected. So this.$el is defined, querySelectorAll() returns the nodes and I can iterate through them with forEach(). What is wrong here, how do I get rid of the error?

NicOwen
  • 171
  • 1
  • 3
  • 8
  • Even that works fine, it's not the vue way – Boussadjra Brahim May 26 '21 at 07:43
  • I'm new to Vue, what would be best practice to implement [what I described here](https://stackoverflow.com/questions/67685857/vue-3-how-to-implement-a-function-that-modifies-all-input-fields-in-the-dom) – NicOwen May 26 '21 at 07:47
  • 1
    You could use refs https://v3.vuejs.org/guide/component-template-refs.html – Boussadjra Brahim May 26 '21 at 07:51
  • 1
    Thanks, but getting the same error with $refs. So the Vue way would be binding it to each element directly instead of doing it in a loop through the DOM, right? – NicOwen May 26 '21 at 10:16

0 Answers0