1.7 KiB
1.7 KiB
省市区数据加载说明
问题
省市区下拉框显示为空
原因
- Vite代理配置需要重启开发服务器才能生效
- 如果代理加载失败,会使用后备数据
解决步骤
1. 重启开发服务器
# 停止当前运行的开发服务器 (Ctrl+C)
# 然后重新启动
cd admin
npm run dev
2. 检查控制台日志
打开浏览器开发者工具的Console标签,应该能看到:
- "开始加载省市区数据..."
- "响应状态: 200"
- "加载的数据条数: XX"
- "regionOptions 已设置,条数: XX"
3. 如果代理失败
如果看到错误信息,会自动使用后备数据,包含:
- 四川省(成都市、绵阳市)
- 北京市
- 上海市
- 广东省(广州市、深圳市)
配置说明
Vite代理配置 (admin/vite.config.ts)
server: {
proxy: {
'/api-proxy': {
target: 'https://admin.zhenyangtang.com.cn',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api-proxy/, '')
}
}
}
前端请求 (admin/src/views/consumer/prescription/index.vue)
const response = await fetch('/api-proxy/area/ChinaCitys.json')
生产环境配置
生产环境需要在nginx配置代理:
location /api-proxy/ {
proxy_pass https://admin.zhenyangtang.com.cn/;
proxy_set_header Host admin.zhenyangtang.com.cn;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
测试
- 打开创建订单对话框
- 查看"省市区"下拉框
- 应该能看到省份列表
- 选择省份后能看到城市列表
- 选择城市后能看到区县列表