vue

预备:先安装淘宝镜像 

npm install -g cnpm --registry=https://registry.npm.taobao.org

 

1.安装 vue-cli  => cnpm install vue-cli

2.初始化 vue init webpack YHJ(项目名字)

3.安装对应的模块 插件  cnpm install

4.路由使用  (路由当前样式 linkActiveClass: 'active')

(1.引入模板 ,路由 =》  import 模板名字 from 模板路径

2.启用路由  vue.use(Router)

3.实例化路由 new Router({})

4.配置路由 

routes : [{ path: '路由路径',name:'名字', component :模板名称}]

 

5.切换使用路由(链接时间 需要加上 @click.native)

<router-link  :to="路径" @click.native="reds(index)" :class="{red:current == index}" ></router-link>

 

6.请求本地模拟数据

var express = require('express')
var app = express()
var appData = require('../data.json')//加载本地数据文件 var seller = appData.seller//获取对应的本地数据 var goods = appData.goods var ratings = appData.ratings
//devServer,在里面添加
before(app) {
  app.get('/api/seller', (req, res) => {
    res.json({
      errno: 0,
      data: seller
    })//接口返回json数据,上面配置的数据seller就赋值给data请求后调用
  }),
  app.get('/api/goods', (req, res) => {
    res.json({
      errno: 0,
      data: goods
    })
  }),
  app.get('/api/ratings', (req, res) => {
    res.json({
      errno: 0,
      data: ratings
    })
  })
} 
 

 

posted @ 2018-03-27 09:16  Y-HJ  阅读(250)  评论(0编辑  收藏  举报