vue总结

导航路由
1.router-link导航标签，里面有个to属性，属性值是要跳转的页面/加载视图。编辑
2.router-view视图容器，内加载相应的组件。写出相应的模板；写出相应的组件， 组件只要对象，不用标签，直接var一个新对象template：“#index”相应的组件名称;
3.配置路由规则，有几个跳转写几个对象
var一个数组，数组内以对象的形式，对象给两个属性，path：url路径跳转名，component：组件名
4.创建路由对象
var router=new一个VueRouter({
routers:路由规则名
})
5.将路由对象挂载到vue实例上
在实例里有一个router属性挂载：路由对象
tag=“p”可以把路由导航标签转换成想要换的标签，属性值是变换成的标签，写在导航标签想要转换的子标签上。

首页默认加载视图
路由规则里path:"*(或/)",redirect:’/index’;表示没有任何URL路径直接跳转第一个模板展示内容；

button跳转
在要跳转的模板template中的button上加上点击事件，在组件methods中的函数里加上router.push（‘/index4’）//push是router提供的，称为编程式路由。

router.go("-1")表示返回上一页

嵌套路由（同一页面加载详情）
1.在哪个模板加载，在哪里创建一个容器:
2.路由规则里 要加载的对象里加个子路由children:[
{path:’’…}
]
4.以上步骤可以更改路径不能更新内容。在data并列的地方加上watch监听，监听"$route"(a,b){
console.log(a)用a的数据通过复制axios重新获取，更改一下里面获取数据的路径
}

路由命名
1.导航标签里以name定义
:to:"{name:’’}",路由规则里谁用name:“xq"它就用哪个路由规则。
传递多个参数以query传递，url里？后的属性是query传参的形式。
列:模板里:to=”{name:‘detail’,query:{id:item.id}}";
路由规则里:{path:"/detail",name:“detail”,component:Detail};
组件里用query传的参就用query接，用params传的就用params接。

2.给视图容器定义name
同一个页面展示多个视图容器；
1.写两个视图容器;
2.路由规则里相应的对象里改成components:{//注意component加了s因为有多个对象
default:Index,//默认的
index2:Aa
}

路由传参
params存储路径参数(用于单个参数)
path:"/index/: id"
获取 $router.params.id
子级页面的跳转
1.需要引入axios.js,然后在需要的组件里用mounted在更新渲染后发起请求。用axios（相当于ajax）；在需要获取的模板里以v-for遍历出来；详情页在获取到的属性外部加上router-link导航标签，多一个导航标签就要多一个路径组件路由规则；
2.params单数据获取:在标签to的数值后面加/id表示传的参数(如果传的是变量:to=“’/index/’+item.id”)，路由规则里对应的path数值后加上/:id声明变量保存；
3.与params对应的有个加粗样式加粗样式route.params接收参数；当渲染完成后mounted里以axios的形式调取数据，注意this指向；获取数据后data里创建一个字符串保存，返回模板中调取{{data}}。

query 存储路径参数(用于多个参数)
用name命名的路由规则才能传多个参数，用法看路由命名里

组件
有全局组件 和 私有组件，组件要写到构造器里面的
全局组件还是要在vue范围内使用，但是任何vue范围都可用
component注册组件 第一个参数是组件名称调用用 第二个参数是方法 extend构造器

全局组件写在实例化之前
私有组件实例里面直接components

组件的数值在后边直接data：function（）{
return{
title:""
}
}
组件data之间不会有影响
事件同样
全局组件在别的组件内部也能用，私有组件在别的组件内不能用，在哪注册了在哪才能用

父组件—子组件传值
☆总结:父组件里给子组件绑定一个自定义属性:name=“info”,属性值为父组件需要传递的属性，子组件内部有个props：[‘属性名’]用于接收属性名（数组形式）

子组件—父组件
子传送用this.$emit{(}^{\prime }toparen{t}^{\prime },this.info)父组件通过从子组件上的事件获取，这里的事件不加（），如果加上（）里面要加$enent
总结:在子组件标签上绑定自定义事件，值为父组件函数；子组件内部通过$emit给该事件推送数据，父组件内部通过函数参数接收.

非父子组件
$emit mounted $on
总结:如果相互传值的组件都公有一个父组件的话，共同父组件中设定一个data用于储存你要传递的数据，然后两个子组件都通过props连接父组件的这个data，实现一个三方同步。

生命周期
不能用箭头函数，不能指向父级
☆生命周期称为 钩子函数辅助生命周期管理 （有11个，4大阶段）
生命周期最初
1.beforeCreate()//在创建之前
不能拿到数据
2.created（）//已创建
能拿到数据，但是拿不到实例化的DOM对象

创建
1.beforeMount//在渲染之前
不能看到最新的渲染
2.mounted
能看到最新的渲染，

更新 ：有触发条件，只要有更新改变就能触发
1.beforeUpdate
//更新之前
2.updated
//更新之后 最好不要再触发改变

销毁 需要触发，销毁之后不能再使用（实例，数据，事件解绑）
1.beforeDestroy//在销毁之前
2.destroyed//销毁