Hey there all you programmers,
I'm reaching out to see if any of you have insight on how I can modify the style of a specific component within an Object array.
This is the code snippet:
<template>
<div>
<ul>
<li v-for="jokes in joke" :key="jokes" :class="jokes">
{{ jokes.title }}: <br />{{ jokes.text }} <br /><br />
</li>
</ul>
</div>
</template>
<script>
export default {
name: "Liste",
props: ["joke"],
};
</script>
<style scoped>
.jokes {
font-weight: bold;
}
</style>
Essentially, my aim is to only apply the bold styling to the jokes.title component of the jokes array, without affecting the entire content of the jokes array.
Thank you in advance for your assistance, greatly appreciated! <3