inject the function to activate a topic

This commit is contained in:
Andreas Zweili 2021-02-06 16:23:14 +01:00
parent 0becd05b7c
commit 6ca18f4f8d
4 changed files with 9 additions and 11 deletions

View File

@ -4,7 +4,7 @@
:topic-title="activeTopic && activeTopic.title"
:text="activeTopic && activeTopic.fullText"
></active-element>
<knowledge-base @select-topic="activateTopic"></knowledge-base>
<knowledge-base></knowledge-base>
</div>
</template>
@ -34,7 +34,8 @@ export default {
},
provide() {
return {
topics: this.topics
topics: this.topics,
selectTopic: this.activateTopic
};
},
methods: {

View File

@ -1,9 +1,7 @@
<template>
<section>
<h2>Select a Topic</h2>
<knowledge-grid
@select-topic="$emit('select-topic', $event)"
></knowledge-grid>
<knowledge-grid></knowledge-grid>
</section>
</template>

View File

@ -2,13 +2,14 @@
<li>
<h3>{{ topicName }}</h3>
<p>{{ description }}</p>
<button @click="$emit('select-topic', id)">Learn More</button>
<button @click="selectTopic(id)">Learn More</button>
</li>
</template>
<script>
export default {
inject: ['selectTopic'],
props: ['id', 'topicName', 'description'],
emits: ['select-topic'],
emits: ['select-topic']
};
</script>
</script>

View File

@ -6,14 +6,12 @@
:id="topic.id"
:topic-name="topic.title"
:description="topic.description"
@select-topic="$emit('select-topic', $event)"
></knowledge-element>
</ul>
</template>
<script>
export default {
inject: ['topics'],
emits: ['select-topic']
inject: ['topics']
};
</script>