43 lines
1.0 KiB
Vue
43 lines
1.0 KiB
Vue
<template>
|
|
<div class="border-b">
|
|
<div>
|
|
<h2 class="text-gray-800 font-bold text-3xl text-center mt-3 mb-2 MvAamu">
|
|
ތަފާތު މައުޟޫޢުތައް
|
|
</h2>
|
|
</div>
|
|
|
|
<div class="flex flex-wrap justify-center">
|
|
<a
|
|
href=""
|
|
v-for="topic in topics"
|
|
:key="topic.id"
|
|
class="text-sm font-medium border border-gray-700 py-1 px-3 rounded-full mr-2 mt-2 mb-4 hover:bg-green-100 MvTyper"
|
|
style="color:#4A5568;"
|
|
v-text="topic.name"
|
|
></a>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "discover-topics",
|
|
data() {
|
|
return {
|
|
topics: []
|
|
};
|
|
},
|
|
|
|
mounted() {
|
|
axios
|
|
.get("api/topics")
|
|
.then(response => {
|
|
this.topics = response.data.data;
|
|
})
|
|
.catch(error => {
|
|
console.log(error);
|
|
});
|
|
}
|
|
};
|
|
</script>
|