一,页面跳转的效果
1,通过v-if或者v-show

当默认dialog1:false,组件是隐藏的,通过接受组件selectdetail里的事件
触发事件showdevice带入形参{cateid:3,data:resp.body.data}, 以及事件listenOpenChild
改变dialog1的值
隐藏组件。
2,通过路由跳转
通过事件触发路由
二,组件之间传值的方法。
1,子父组件
在子组件内定义props
在父组件内传值
2,跳转组件之间的传值。
组件A跳转到B
组件A发出

组件B 接收

三,在滚轮刷新加载信息的时候,如何让刷新的内容显示在当前页面。
因为从后台接收的数据都是由数组容器接收,因此可以在导入数组的时候有2中方式。
1,用你concat连接2个数组

以上示例,this.dataList是组件内的容器,contain是接收到的,将接收到的contain拼接在之后,并重新赋值给this.dataList
,页面通过v-for(item of dataList)渲染,如果想将接收到的数据显示在最前面,可以这样
this.dataList=contain.concat(this.dataList)
2,第二种方法就是用push,原理类似。
四,v-for渲染出来的列表,想要跳转到遍历元素(item)相关的界面,可以添加event(事件),将item的属性作为形参带入event函数,通过函数,重新拼参数进行跳转。
1,通过v-if或者v-show

当默认dialog1:false,组件是隐藏的,通过接受组件selectdetail里的事件

触发事件showdevice带入形参{cateid:3,data:resp.body.data}, 以及事件listenOpenChild
改变dialog1的值
隐藏组件。2,通过路由跳转
通过事件触发路由
二,组件之间传值的方法。
1,子父组件
在子组件内定义props
在父组件内传值
2,跳转组件之间的传值。
组件A跳转到B
组件A发出

组件B 接收

三,在滚轮刷新加载信息的时候,如何让刷新的内容显示在当前页面。
因为从后台接收的数据都是由数组容器接收,因此可以在导入数组的时候有2中方式。
1,用你concat连接2个数组
以上示例,this.dataList是组件内的容器,contain是接收到的,将接收到的contain拼接在之后,并重新赋值给this.dataList
,页面通过v-for(item of dataList)渲染,如果想将接收到的数据显示在最前面,可以这样
this.dataList=contain.concat(this.dataList)
2,第二种方法就是用push,原理类似。
四,v-for渲染出来的列表,想要跳转到遍历元素(item)相关的界面,可以添加event(事件),将item的属性作为形参带入event函数,通过函数,重新拼参数进行跳转。
本文介绍了前端开发中的页面跳转效果实现方法,包括使用v-if/v-show控制组件显示及路由跳转;探讨了组件间的数据传递方式,如子父组件间的props传递及不同组件间的跳转数据传递;此外还讨论了滚动刷新时如何更新页面内容的技术方案,以及利用v-for渲染列表并实现跳转的功能。
2358

被折叠的 条评论
为什么被折叠?



