- 前端 (HTML/CSS/JavaScript)cy2.cn
这里仅提供一个简单的商品列表展示:
html
商品列表
<script>
// 假设从后端获取的数据
const products = [
{ id: 1, name: '商品1', price: 100 },
{ id: 2, name: '商品2', price: 200 },
// ...更多商品
];
products.forEach(product => {
const listItem = document.createElement('li');
listItem.textContent = `${product.name} - 价格: ${product.price}`;
document.getElementById('productList').appendChild(listItem);
});
</script>
2. 后端 (Python - Flask) 这里仅提供一个简单的Flask路由,用于模拟商品数据的获取:
python
from flask import Flask, jsonify
app = Flask(name)
模拟的商品数据
products = [
{‘id’: 1, ‘name’: ‘商品1’, ‘price’: 100},
{‘id’: 2, ‘name’: ‘商品2’, ‘price’: 200},
# …更多商品
]
@app.route(‘/products’, methods=[‘GET’])
def get_products():
return jsonify(products)
if name == ‘main’:
app.run(debug=True)
3. 后端 (Node.js - Express)
同样是一个简单的Express路由,用于模拟商品数据的获取:
javascript
const express = require(‘express’);
const app = express();
const port = 3000;
// 模拟的商品数据
const products = [
{ id: 1, name: ‘商品1’, price: 100 },
{ id: 2, name: ‘商品2’, price: 200 },
// …更多商品
];
app.get(‘/products’, (req, res) => {
res.json(products);
});
app.listen(port, () => {
console.log(App listening at http://localhost:${port}
);
});
4. 数据库 (SQL - 使用MySQL为例)
这里仅提供一个简单的MySQL表结构,用于存储商品数据:
sql
CREATE TABLE products (
id INT AUTO_INCREMENT PRIMARY KEY,
name VARCHAR(255) NOT NULL,
price DECIMAL(10, 2) NOT NULL
);
– 插入示例数据
INSERT INTO products (name, price) VALUES (‘商品1’, 100.00);
INSERT INTO products (name, price) VALUES (‘商品2’, 200.00);
注意:以上代码仅用于演示目的,一个真实的购物商城系统会更加复杂,并需要考虑安全性、性能优化、错误处理等多个方面。