十年网站开发经验 + 多家企业客户 + 靠谱的建站团队
量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决
一开始的需求是这样子的,我为了实现两个页面组件之间的数据传递,假设我有页面A,点击页面A上的某一个按钮之后,页面会自动跳转到页面B,同时我希望将页面A上的某一些参数携带过去给页面B。(我知道,小参数的时候可以通过路由的params或者query去传参数,或者大型数据可以用vuex来处理,很遗憾我到现在还没有做很大型的项目,所以还没有用过vuex,接下来会学习一下。)
成都创新互联主营澧县网站建设的网络公司,主营网站建设方案,成都APP应用开发,澧县h5重庆小程序开发搭建,澧县网站营销推广欢迎澧县等地区企业咨询然后我就想,这不就是不同组件之间的数据传递问题而已吗?直接用bus 巴士事件来传递数据不就行了吗。于是,我就很愉快地进行了。关于vue中的eventbus的使用,我之前在一篇vue中的数据传递中有提到过。
先给你们看一下我一开始的代码:
实现目标:
点击之后,bus emit事件,然后顺便跳转路由到/moneyRecord页面。
接下来就是在MoneyRecord页面中去on接收这个事件,然后接受参数。
// 这是页面A的内部触发bus事件的代码 editList (index, date, item) { // 点击进入编辑的页面,需要传递的参数比较多。 console.log(index, date, item) bus.$emit('get', { item: item.type, date: date }) this.$router.replace({path: '/moneyRecord'}) } // moneyRecord页面 created () { //这里我将icon的list给保存下来了 bus.$on('get', this.myhandle) }, methods: { myhandle (val) { console.log(val, '这是从上个页面传递过来的参数') } }
另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。