generated from dwd/boilarplate-astro-tailwind
64 lines
2.1 KiB
Vue
64 lines
2.1 KiB
Vue
<template>
|
|
<div>
|
|
<section class="container mx-auto px-4">
|
|
<label for="langValue">Read Also:</label>
|
|
<select v-on:change="dataCall()" v-model="langValue" name="langValue" id="langValue">
|
|
<option value="en">English</option>
|
|
<option value="bn">Bengali</option>
|
|
<option value="hi">Hindi</option>
|
|
<option value="zh">Mandarin</option>
|
|
<option value="es">Espanish</option>
|
|
</select>
|
|
<div v-for="items in items" :key="items.id">
|
|
<p>{{ items.title }}</p>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
data(){
|
|
return{
|
|
data: "",
|
|
items: "",
|
|
langValue: 'en'
|
|
}
|
|
},
|
|
methods: {
|
|
dataCall(){
|
|
// let fullURL = window.location.href;
|
|
// console.log(fullURL)
|
|
console.log(langValue)
|
|
fetch(`https://apisp.dev2.cicdhosting.com/_dedicated/dwd/get-news/?action=news_${this.langValue}`)
|
|
.then(data => data.json())
|
|
.then(data => {
|
|
console.log(data)
|
|
this.items = data;
|
|
})
|
|
.catch(error => {
|
|
console.error(error)
|
|
})
|
|
}
|
|
// getData() {
|
|
// fetch('https://apisp.dev2.cicdhosting.com/_dedicated/dwd/get-news/')
|
|
// .then(response => {
|
|
// if (!response.ok) {
|
|
// throw new Error('Network response was not ok');
|
|
// }
|
|
// return response.json();
|
|
// })
|
|
// .then(data => {
|
|
// // Handle the JSON response data
|
|
// console.log(data);
|
|
// })
|
|
// .catch(error => {
|
|
// // Handle any errors that occurred during the fetch
|
|
// console.error('Fetch error:', error);
|
|
// });
|
|
// }
|
|
},
|
|
mounted() {
|
|
this.dataCall(); // Call the getData function when the component is mounted
|
|
}
|
|
};
|
|
</script> |