While working on some code from a tutorial, I came across the challenge of implementing a validator in a similar fashion to the example provided. My task involves utilizing the script setup, typescript, and the composition API.
props: {
image: {
type: String,
default: require("@/assets/default-poster.png"),
validator: propValue => {
const hasImagesDir = propValue.indexOf("@/assets/") > -1;
const listOfAvailableExt = [".jpeg", ".jpg", ".png"];
const isValidExt = listOfAvailableExt.some(ext =>
propValue.endsWith(ext)
);
return hasImagesDir && isValidExt;
}
}
}
Although I understand how to define the type and set a default value, I'm struggling to incorporate a validator into the mix. Is there a specific function that can be used to validate different properties?
interface Props {
image: string
}
const props = withDefaults(defineProps<Props>(), {
image: require("@/assets/default-poster.png")
});