[Vuejs]-Load variables in a view, then use them from a component Vue.js

by

1👍

✅

It’s technically possible to pass data to the current component in view by binding the data to props on the <router-view>:

<my-email-verification v-model="verified" />
<router-view :verified="verified" />

This requires that the email verification component support v-model by accepting a value prop and emitting new values with an input event:

// MyEmailVerification.vue
export default {
   props: ['value'],
   mounted() {
      const isVerified = /* ... */
      this.$emit('input', isVerified)
   }
}

seems like a bad practice. is it?

Opinion: No, I think it’s good practice to stay DRY. However, I personally prefer using components only to render something. For your use case, I would move the email verification into a utility class, import it into App.vue, invoke it as needed (e.g., mounted()), and store the result in a local data property (isVerified).

Leave a comment