vue学习分享

132 阅读1分钟

//升级npm版本 npm install -g npm cnpm install -g cnpm

vue环境的搭建以及vue-cli使用

vur-cli构建SPA应用 npm install -g vue-cli

//简单模式下的项目 vue init webpack-simple demo

//完整模式的项目 vue init webpack demo2

路由的传参模式
//测试动态路由http://localhost:8080/#/goods/82/user/kage
取值方法

route.params.goodsIdroute.params.name

{ path: '/goods/:goodsId/user/:name', name: 'GoodsList', component: GoodsList }

//路由的显示模式
mode:"history", //指定模式http://localhost:8080/goods/82/user/kage

mode:"hash", // 指定哈希的访问模式:http://localhost:8080/#/goods/82/user/kage

//路由的三种访问方式
1.跳转到购物车页面
2.router-link:to="{name:'Cart'}"通过指定name跳转到购物车页面

3.<button @click="jump">button --跳转到购物车页面
//this.router.push("/cart")                                                             
  //this.router.go(-1);

//命名试图

//title对应组件的名称
//img对应组件的名称
{ path:"/",
name:'GoodsList',
components:{
default:GoodsList,
title:Title,
img:Image
}
},