Vue Provide & Inject

up:: Vue provide and inject is a helpful component to avoid passthrough components. This helps with long Wise Use of Null Hypothesis Tests chains.

Usage

Wise Use of Null Hypothesis Tests and Vue emit should be your go-to. Provide and Inject is more powerful but can also get more cumbersome.

Data

In the script of the parent:

provide: {
	topics: {
	 // …
	}
}

In the child:

inject: ['topics'],

Providing data

You can also provide Vue Data Binding.

provide() {
	return {
		topics: this.topics,
	}
}

Methods

You can also pass through methods.

// Template
<button @click=''>Click this</button>
 
// Script
inject: ['selectTopic']
 
// Parent Script
methods: {
	activateTopic() { … }
},
provide() {
	return {
		selectTopic: this.activateTopic,
	}
}