vue的小项目,对于多组件之间的状态管理,不使用Vuex,可以使用provide/inject完成数据管理。
父组件使用provide 封装数据
<template>
<div>
....
<Books></Books>
</div>
</template>
<script>
import Books from "./Books.vue";
export default {
data() {
return {
Info: {
theme: "aaaa",
},
};
},
provide() {
return {
theme: this.Info,
};
},
components: {
Books,
},
};
</script>
任意层级的子组件使用inject来引用数据
<template>
<h3>{{ theme.theme }}</h3>
</template>
<script>
export default {
inject: ["theme"],
};
</script>
<style>
</style>