Имеется компонент, который я использую на разных страницах
В этом компоненте все данные берутся из массивовю Например пути для изображений из одного массива, а названия блоков из другог массива.
Я хотел бы использовать тот же самый компонент на другой странице, но там уже будут использоваться уже другие изображения и названия блоков(titles) Изображения и titles также будут браться из массивов, но они могут быть больше или меньше по размеру
Как это можно сделать?
Компонент, который я хочу использовать:
<div class="features container">
<div
class="features-item"
v-for="(image, imageIndex) in images"
:key="imageIndex"
>
<div class="feature__img">
<img :src="image" alt="" />
</div>
<div class="feature__text">
<h2>{{ featureHeaders[imageIndex] }}</h2>
<p>{{ featureText[imageIndex] }}</p>
</div>
</div>
</div>
export default {
data() {
return {
featureHeaders: [
"Trail Difficulty (1 out of 5)",
"GPS Coordinates & Elevation",
"Google Maps Birds-Eye-View",
"Directions"
],
featureText: [
"Text for first image",
"Text for second image",
"Text for third image",
"Text for fourth image",
],
images: [
require("../assets/images/primary_features/trail.png"),
require("../assets/images/primary_features/gps.png"),
require("../assets/images/primary_features/earth.png"),
require("../assets/images/primary_features/time.png"),
]
}
}
}
Страница, на которой использую компонент:
<Primary_Features />
import Primary_Features from "../components/Primary_Features";
export default {
name: "Pricing",
components: {
Primary_Features
}
