<template>
<swiper
:slides-per-view="1"
:space-between="10"
:loop="true"
>
<swiper-slide v-for="(word,i) in words_array" :key="i">
<div class="word word-test">
<h4>{{word.name_en}}</h4>
</div>
<div class="answers">
<button>{{word.name}}</button> <!--правильный ответ-->
<button v-for="(answer,i) in words_array.slice(0, 3)" :key="i"> <!--вот тут нужно случайным образом выводить слова-->
{{answer.name}}
</button>
</div>
</swiper-slide>
</swiper>
</template>
<script>
import { Swiper, SwiperSlide } from 'swiper/vue';
import 'swiper/css';
export default {
components: { Swiper, SwiperSlide },
props: ['words_array'],
data() {
return {
myWords: this.words_array
}
},
methods: {
randomWords() {
// let chosenNumber = Math.floor(Math.random() * 3);
}
},
created() {
console.log(this.myWords);
}
}
</script>import { initializeApp } from "firebase/app";
import { getStorage } from "firebase/storage";
import { getFirestore, collection } from "firebase/firestore";
const firebaseConfig = {.......};
const app = initializeApp(firebaseConfig);
const db = getFirestore(app);
const categoriesRef = collection(db, 'categories');
const storage = getStorage(app);
export default { categoriesRef, storage };import { categoriesRef, storage } from '@/firebase'
import { addDoc } from "firebase/firestore";
import { ref, uploadBytesResumable, getDownloadURL } from "firebase/storage"async createCategory(у) {
console.log('Create doc');
let file = e.target.files[0];
this.file = file;
let storageRef = ref(storage, 'categories/'+this.file.name);
const uploadTask = uploadBytesResumable(storageRef, this.file);
uploadTask.on('state_changed', (snapshot) => {console.log(snapshot);},
(error) => {
switch (error.code) {
case 'storage/unauthorized':
break;
case 'storage/canceled':
break;
case 'storage/unknown':
break;
}
},
() => {
getDownloadURL(uploadTask.snapshot.ref).then((downloadURL) => {
this.imgUrl = downloadURL;
//console.log('File available at', this.imgUrl);
});
});
const addedDoc = await addDoc(categoriesRef, this.$data);
console.log(addedDoc);
}