How can I define the description as a type in my code? When I run it, I get an error that says "Property 'description' does not exist on type '{ takePhoto(): Promise; }'"
<script lang="ts">
import {
IonPage,
IonToolbar,
IonContent,
IonButton,
IonTextarea,
} from "@ionic/vue";
import { storage, auth, db, arrayUnion } from "../firebase";
import { Plugins, CameraResultType, CameraSource } from "@capacitor/core";
import postData1 from "../firebase";
import postData2 from "../firebase";
import userPosts from "../firebase";
const { Camera } = Plugins;
export default {
name: "Tab1",
components: {
IonToolbar,
IonContent,
IonPage,
IonButton,
IonTextarea,
},
data() {
return {
description: "",
};
},
methods: {
async takePhoto(): Promise<void> {
const image = await Camera.getPhoto({
resultType: CameraResultType.Base64,
source: CameraSource.Camera,
quality: 60,
});
if (image?.base64String) {
const user = auth.currentUser;
const id = uuidv4();
const filePath = `post/${id}.${image.format}`;
const storageRef = storage.ref();
await storageRef
.child(filePath)
.putString(image.base64String, "base64");
const url = await storageRef.child(filePath).getDownloadURL();
const postData = {
uid: user?.uid,
id: id,
image: url,
description: this.description
};
const addPost = async (post: any) => {
await db.collection("post").doc().set(post);
await db
.collection("users")
.doc(user?.uid)
.update({
posts: arrayUnion(post),
});
await userPosts();
await postData1();
await postData2();
return true;
};
addPost(postData);
}
},
},
};
</script>
Apologies for the lengthy code. Any suggestions on how to resolve this issue or refactor the code? I've tried rearranging some parts but it didn't work.