#javascript #json #image #pug
Вопрос:
Я создаю страницу продуктов, используя express с pug в качестве шаблона, и сохраняю данные в файле JSON, но на странице продуктов изображения не загружаются, я просто получаю ссылки обратно. дайте мне знать, если вам нужно, чтобы я показал вам что-то еще, у меня также есть route.js файл.
JSON
[ { "name": "Jetpack pitus", "price": 150000, "model": "2021", "img_url": "https://cdn2.unrealengine.com/Fortnite/patch-notes/v4-2-contentupdate/header-v4-2-content-update/Jetpack-1920x1080-20e524ca933c434a4c07719a5405e60041b47a1f.png" }, { "name": "Jetpack venus", "price": 125000, "model": "2020", "img_url": "https://www.ginx.tv/uploads/Iron_Man_Stark_industries.png" }, { "name": "Jetpack enormus", "price": 200000, "model": "2022", "img_url": "https://www.x-jetpacks.com/wp-content/uploads/Jetpack-NX-Square-front-and-back.jpg" } ]
мопс:
extends layout block content each product in data p=product.name p=product.price p=product.model p=product.img_url p a.btnOrder(href='/orders') Make an order!!!
index.js:
const express = require('express'); const pug = require('pug'); const path = require('path'); const routes = require('./routes/routes'); const app = express(); app.set('view engine', 'pug'); app.set('views', __dirname '/views'); app.use(express.static(path.join(__dirname, '/public'))); const urlendcodedParser = express.urlencoded({ extended: false }); app.get('/', routes.index); app.get('/products', routes.productsData); app.get('/orders', routes.orders); app.get('/submitted', routes.submitted); // app.post('/submitted', urlendcodedParser, routes.submitted); app.listen(3000);
Ответ №1:
Предполагая , что вы render
правильно вызываете метод и передаете свой массив как data
, то для отображения изображений это должно быть что-то вроде:
each product in data p=product.name p=product.price p=product.model p img(src=product.img_url) p a.btnOrder(href='/orders') Make an order!!!
Возможно, вы также захотите сделать запрос на заказ более конкретным, а не общей страницей для всех продуктов:
a.btnOrder(href="/orders?model=" product.model) Make an order!!!
Конечно, вам нужно закодировать маршрут /orders
, чтобы прочитать строку запроса.
Комментарии:
1. спасибо, это работает просто идеально!!