- 博客(5)
- 收藏
- 关注
原创 混入
1、混入 作用:用来分发Vue组件中的可复用功能。一个混入对象里面可以有任意组件选项,一个组件可以通过mixins调用混入对象,从而使用对象里面的组件选项。例如:使用混入后,组件MyComponent相当于定义了一个created钩子函数和一个startMixin()方法。2、组件本身选项与被调混入对象选项合并策略: 1>数据对象进行递归合并,发生冲突时以组件的数据优先 2>同名的钩子函数都会被合并到一个数组中,并都会被调用,但是混入对象的钩子优...
2020-07-16 19:58:46
347
原创 vue 动态组件、异步组件
1、动态组件 动态组件适用于在多标签页面中动态切换组件,通过component元素的is属性实现。例如:需要在一个页面中动态切换商品介绍、商品评价和用户问答三个按钮标签,代码如下:注册三个组件的实现代码:在根实例中定义两个数据属性和一个计算属性,为了便于使用v-for指令循环渲染button按钮,以及动态切换组件,代码如下:数据属性currentTab表示当前的标签页,tabs数组表示需要显示的数据属性内容,通过v-for标签来渲染tabs数组对应的标签,计算属性curre..
2020-07-13 15:08:30
397
原创 vue 插槽
1、Slot 使用插槽目的:解决组件之间的内容通信,插槽也可以作为父子组件之间通信的另一种实现方式 <slot></slot>:相当于一个占位符,例如: 结果:2、缺省内容 在子组件内部使用<slot>元素时,可以给该元素指定一个内容,若父组件没有提供插槽内容,则渲染效果中的内容为该元素指定的内容,如果父组件提供了插槽内容,则渲染效果的内容为父组件提供的值3、父级作用域通过具名插槽与子组件通信 如果...
2020-07-11 21:04:43
209
原创 vue 在嵌套路由中设置导航链接和嵌套子路由
第一种方法:设置导航链接:设置父级导航链接:设置子一级导航链接:对应的嵌套路由配置:第二种方法:设置导航链接:设置父级导航链接:设置子级导航链接:对应的嵌套路由配置(配置嵌套子路由时需要去掉根路径“/”):注意: 在设置导航链接时,需注意to的属性值是否为表达式,如果是,则需要使用v-bind命令,或在to前加上冒号。在使用命名路由来设置导航链接时,由于to的属性值是表达式,因此也需要在to前面加上v-bind命令,或者冒号。...
2020-06-23 18:25:50
697
原创 vue 动态路由匹配
解决的问题: 需要把匹配某种模式的路由映射到同一个组件,例如有一个Book组件,对于所有ID各不相同的图书,都使用这个组件来渲染,这就可以使用路径中的动态段来实现。动态段使用冒号(:)标记,如/book/:id,即/book/1,/book/2,和/book/foo都将映射到相同的路由。当匹配到一个路由时,动态段的值将被保存到this.$route.params(this.$route代表当前路由对象)中,可以在组件内使用。需要先安装vue-router插件: 代码示例:App....
2020-06-23 14:05:41
1371
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人