2项目目录设计

svg图片不会直接使用,而是生成图标字体来使用。生成图标字体的网站https://icomoon.io/icons.html。

图标字体的code如下所示

项目的所有文件都放在src文件夹。main.js文件是整个项目的入口文件,app.vue是整个页面的vue实例文件。src文件下会新建一个common文件,用来包含项目公共的文件和资源,common文件夹下新建三个目录,fonts,js,stylus。stylus是一个CSS预处理器,styl文文件和CSS文件相比,styl文件不需要分号,冒号也可以省略,但为了便于阅读保留分号。components文件下是各个组件的文件(注意组件的就近维护原则)。

用json文件来模拟后台数据,json文件中的数据主要包含三个对象,seller,goods,ratings。

在build->dev-server.js文件中获取json文件中的数据,定义路由apiRoutes

var appData = require("../data.json");
var seller = appData.seller;
var goods = appData.goods;
var ratings = appData.ratings;

var apiRoutes = express.Router();

errno参数表示是否有错误,errno:0表示数据正确。data是返回的数据。

apiRoutes.get('/seller', function (req, res) {
res.json({
errno: 0,
data: seller
});
});

apiRoutes.get('/goods', function (req, res) {
res.json({
errno: 0,
data: goods
});
});

apiRoutes.get('/ratings', function(req, res) {
res.json({
errno: 0,
data: ratings
});
});

用use请求到数据

app.use('/api', apiRoutes);

原文地址:https://www.cnblogs.com/dingzibetter/p/7257754.html