资讯专栏INFORMATION COLUMN

BUI Webapp用于项目中的一点小心得

harriszh / 1659人阅读

摘要:接触也有一段时间,也用在了移动端的项目开发中,总的来说,该框架用起来也挺灵活的,控件可以自由定制,前提是自己能认真地学习该框架的,因为里面说的东西比较详细,如果没有仔细看的,可能有些功能点没有看到而导致一些效果弄不了,以下是我学习运用所得到

接触BUI也有一段时间,也用在了移动端的项目开发中,总的来说,该框架用起来也挺灵活的,控件可以自由定制,前提是自己能认真地学习该框架的api,因为api里面说的东西比较详细,如果没有仔细看的,可能有些功能点没有看到而导致一些效果弄不了,以下是我学习运用bui所得到的一点小心得,说的不好的地方,希望指正

一. 控件的不同使用实现不同的功能

1.使用bui.slide实现轮播图的效果(截图里面的内容不是图片,而是可以配置的文字,当然了可以配置成图片的)


2.使用bui.slide实现新闻轮播的效果(通过设置方向为纵向滚动)

3.使用bui.slide实现底部导航条切换页面的效果

4.使用bui.slide实现tab切换的效果(tab这里有个to的方法,可以激活第几个tab)

以上者几种功能是我使用的比较多的,一个控件可以实现这么多的效果(当然前提是对api有认真地学习),得出来的效果也是挺赞的,不得不佩服开发这套框架的人

不过官网上还有其他几种的效果也是依赖bui.slide来实现的,这里我这边用的比较少,我就不截图了,有兴趣的可以点击http://www.easybui.com/demo/#...

二.bui.back()在单页面开发中的使用

这个方法在项目中,可以绑定到一个特定的返回类名中,这样的话,在需要用到简单返回的页面中,可以直接调用

在已打开的页面中,可使用这个方法返回到指定的页面

 1).如果需要返回到首页去,无论当前页面处在多少个子层级页面里面,则可以使用这个name:"main";

  2).如果在返回某个页面后,需要刷新该页面的数据,则可以利用bui.back()里面的回调函数进行操作(如果是返回main页面,则路劲是main就行,如果是其他页面,则为该页面的路径)图片中的init()和initCart()均为所返回的页面里面的请求数据的方法

三.底部导航条的妙用之处

1.在底部导航条的几个tab中,可能有一些选项是我们需要登录才可以进去的,如果没有登录则先跳去登录然后再返回来该tab,例如下图,

有类似此需求的,我们可以把登录信息的判断在底部导航条的点击的时候作判断,然后把该tab的索引也就是index传过去登录页,然后在登录成功的时候,利用bui.back()返回到所要进去的tab(main里面的tab方法记得要先return出来)

另外如果其他页面也想返回到导航条这里的其中一个tab,也可以使用
loader.require(["main"], function(res) {

var pageTab = res.tab;
pageTab.to(3, "none");

})
这里的3是导航条上的索引,需要自己手动配置("none"表示没有经过动画就切换到对应的tab)

弄过的项目只是用到了bui里面很少的一部分功能而已,bui里面还提供了很多更有趣的的功能,让我们在平时的项目开发中更好地开发,更多功能的学习请参考官网http://www.easybui.com/

文采不好,请见谅,以上是我在使用bui中的一点小心得,希望可以帮到大家一起学习

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/116822.html

相关文章

  • BUI Webapp用于项目中的点小心得

    摘要:接触也有一段时间,也用在了移动端的项目开发中,总的来说,该框架用起来也挺灵活的,控件可以自由定制,前提是自己能认真地学习该框架的,因为里面说的东西比较详细,如果没有仔细看的,可能有些功能点没有看到而导致一些效果弄不了,以下是我学习运用所得到 接触BUI也有一段时间,也用在了移动端的项目开发中,总的来说,该框架用起来也挺灵活的,控件可以自由定制,前提是自己能认真地学习该框架的api,因为...

    klivitamJ 评论0 收藏0
  • BUI Webapp用于项目中的点小心得

    摘要:接触也有一段时间,也用在了移动端的项目开发中,总的来说,该框架用起来也挺灵活的,控件可以自由定制,前提是自己能认真地学习该框架的,因为里面说的东西比较详细,如果没有仔细看的,可能有些功能点没有看到而导致一些效果弄不了,以下是我学习运用所得到 接触BUI也有一段时间,也用在了移动端的项目开发中,总的来说,该框架用起来也挺灵活的,控件可以自由定制,前提是自己能认真地学习该框架的api,因为...

    oogh 评论0 收藏0
  • 一张脑图看懂BUI Webapp移动快速开发框架【上】--框架与工具、资源

    摘要:后续我们还会增加一些实战类的移动开发案例,欢迎关注专栏。进入官网新版预览在线预览需要使用开启设备模拟,效果更佳。 前言 之前写过一篇 2018开发最快的Webapp框架--BUI交互框架 ,如果你还没看过,可以简单看一下,主要介绍了BUI的基本功能,有多少控件,以及实现的思路,BUI 1.5版本以后变化很大,统一新的风格,新的规范750,新增基于Dom的数据驱动,完善了页面的生命周期等...

    wuyumin 评论0 收藏0
  • 微信Webapp开发的各种变态路由需求及解决办法!

    摘要:前言最近在使用开发的一个小商城项目在微信上遇到一些坑及变态需求层层深入整理一下给后来人参考一定有你还不知道的调试缓存问题描述微信打开的页面默认是会缓存的这是为了加载更快本来是好事但对于用来调试的我们就比较痛苦了每每更改一些刷新以后怎么样都去 前言 最近在使用BUI Webapp开发的一个小商城项目在微信上遇到一些坑及变态需求, 层层深入, 整理一下给后来人参考. 一定有你还不知道的! ...

    laoLiueizo 评论0 收藏0

发表评论

0条评论

harriszh

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<