vue学习第20天，简单项目

1，cnpm i vue --save 安装开发依赖 i 是 install 的简写

2，vue-cli -g 全局安装脚手架

3，vue init webpack MyDemoName 在回车输入一些列描述选项 项目名称不能包含大写字母 在 MyDemoName 文件夹下面会构造一个基本的模板文件

4，cd MyDemoName 进入文件 npm install 安装依赖 npm run dev 启动

5，dev 是 package.json 文件 中的 scripts 模块配置的参数的命令的 key 如果配置的是其它 key 值 就 run 其它的 key 值对应的 value 里面的命令 scripts 下面的 key 值对应的命令可以直接拿出来运行

6，build config src 生成的项目主要关注这三个目录

7，build 是打包的地方 尤其是 webpack.base.conf.js 引入一些插件 可以用插件名字去 npm 官网查看文档

8，config 是打包的配置 尤其是 index.js 配置了打包的配置 默认打包后放到 dist 目录下面

9，src 是编写的源码

10，static 是静态资源

11，package 里面有项目库 开发库 引擎等

12，mustache 语法 {{msg}}

13，html赋值 v-html=“”

14，绑定属性 v-bind:id=""

15，表达式 {{ok?'yes':'no'}}

16，文本赋值 v-text=""

17，过滤器 |

18，class 与 style v-bind:class="{}" v-bind:class="[class1,class2]"  v-bind:style="{}"

19，条件渲染 v-if v-else v-else-if v-show  v-cloak

20，事件处理器 v-on:click  .stop阻止冒泡 .prevent 阻止默认事件 .self 元素本身加事件 子元素无效 .once 只生效一次

21，keyup 事件

22，父级给子组件传数据 props

23，import 组件名字 from '路径' 引入组件 components:{组件名字} 注册刚才的组件 <组件名字/> 使用组件

24，子组件给父级传数据 父级使用动态绑定的变量 v-bind:value="bindvalue" v-on:自定义事件 在子组件的事件中触发父级的这个自定义事件 this.$emit('父级组件的自定义事件') 然后父组件的自定义事件里面去改变父级组件的要传递给子组件的那个变量的值 从而实现 父子组件的数据的同步

25，router 路由 /user  /user/:id  /user/:id/name/:pid 

26，前端路由 后端路由

27，缺点 不利于seo 只有一个页面是存在的 前进后退的时候会重新发请求 不会记住滚动条位置 

28，<router-link to="目标路由"></router-link> 路由跳转标签

29，<route-view></route-view> 跳转后渲染的位置

30，动态路由匹配 :id :pid  $route.params({id:'',pid:''})

31，路由模式 mode :history hash hash有/# history 比较逼真

32，嵌套路由 children :[{path:'path',name:'name',component:Component}]  @/ 表示src 目录  /parentpath/childpath

33，编程式路由 $router.push('name') $router.push({path:'name'}) $router.push({path:'name?a=123'}) $router.go(1)

34，$route.query.id 获取路由里面？传递的参数 而不是获取切换时候动态传递的参数 :id

35，命名路由 命名视图 根据名字进行渲染 <route-link v-bind:to="{name:'目标路由的名字'，params:{id:123}}"></route-link> 要用v-bind: 否则不会计算  :id 传递的参数

36，<router-view></router-view> <router-view name="title"></royter-view> components:{default:main,title:Title }