组件化
组件为Vue强大的特性之一,可以进行重复利用,封装可重用的代码,让我们代码模块化
全局注册语法:Vue.component(targetName,options).组件名不能重复,否则会覆盖.如果你使用webpack来构建,即使这个组件你不使用,也会包含在最终的构建中,无疑增加了下载流量
局部注册格式为:组件名:模板对象.给指定的Vue实例注册组件,多个Vue实例之间是独立的.需要在Vue实例中,添加components属性,进行注册组件
使用组件,则需要2步:1)引入组件; 2)注册组件
给组件传递参数,使用prop,你可以在组件上注册的一些自定义 attribute.当一个值传递给一个 prop attribute 的时候,它就变成了那个组件实例的一个属性
自定义事件,子组件发送数据给父组件,子组件可以通过调用内建的 $emit方法并传入事件名称来触发一个事件
通过插槽分发内容,可以向一个组件传递内容
Vue路由
this.$router.push进行编程式路由跳转;<router-link to="/a"> 进行页面按钮式路由跳转; this.$route.params获取路由传递参数;this.$route.query获取路由传递参数;(params 和 query 都是传递参数的,params不会在url上面出现,并且params参数是路由的一部分,是一定要存在的 query则是我们通常看到的url后面的跟在?后面的显示参数.地址栏出现#是hash模式,#以后的不被后台获取;history模式,具有对url历史记录进行修改的功能,需要后台配合处理404的问题.在微信支付,分享中url作为参数传递时#不能满足需求.index中Router对象添加mode: "history".路由的钩子函数首页可以控制导航跳转,beforeEach,afterEach等,一般用于页面title的修改.一些需要登录才能调整页面的重定向功能)
Vuex状态管理模式
vuex 是一个专门为vue.js应用程序开发的状态管理模式,这个状态我们可以理解为在data中的属性,需要共享给其他组件使用的部分.有默认的五种基本的对象:1.state:存储状态(变量); 2.getters:对数据获取之前的再次编译,可以理解为state的计算属性.我们在组件中使用 $sotre.getters.fun(); 3.mutations:修改状态,并且是同步的.在组件中使用$store.commit('',params).这个和我们组件中的自定义事件类似; 4.actions:异步操作.在组件中使用是$store.dispath(''); 5.modules:store的子模块,为了开发大型项目,方便状态管理而使用的。这里就不解释了,用起来和上面的一样
网友评论