102 Provide + Inject for Functions Methods

步骤

1、App.vue中provide()中添加selectTopic

provide() {
    return {
      topics: this.topics,
      selectTopic: this.activateTopic,
    };

2、KnowledgeElement.vue中注入并使用selectTopic

<template>
  <li>
    <h3>{{ topicName }}</h3>
    <p>{{ description }}</p>
    <button @click="selectTopic(id)">Learn More</button>
  </li>
</template>

<script>
export default {
  inject: ['selectTopic'],
  props: ['id', 'topicName', 'description'],
  emits: ['select-topic'],
};
</script>