写个js, 记得select里面的option要给个id 可以定义为 optionid_3
window.onload = function(){
//先获取URL参数
var url = location.href
var paraString = url.substring(url.indexOf("?")+1,url.length).split("&")
for(var i=0i<paraString.lengthi++){
var paramName = paraString.substring(0, paraString.indexOf("="))
var value = paraString.substring(paraString.indexOf("=")+1)
if(paramName == "currentPage"){//这个currentPage就是你传的当前页了
document.getElementByid("optionid_"+value).selected = "selected"
}
}
}
近期的项目是使用react+antd-mobile的h5移动网页端的一个程序,其中一个功能是一个展示列表,具有下拉刷新和上滑加载更多的一个功能,下面就介绍一下这个功能的具体实现;
首先这里我用了antd-mobile的listView和RefreshControl的组件,想了解更多的可以去官网看看 https://mobile.ant.design/docs/react/introduce-cn
(PS:我当时用这个组件的时候,API还没有这么完善,大部分都是去react-native的官方文档中查看的,等我做完了再来看官网就几本跟新的差不多了,也是一把辛酸泪呀~~~~看来官网的维护还是很好的)
这里说一下,如果你要用到RefreshControl的一些监听事件的话,最好吧antd-mobile版本更新一下(最少更新到1.6.1以上),低版本的不支持它的一些监听事件,会报错,如:Uncaught TypeError: this.refs.lv.getInnerViewNode is not a function,版本更新一下就好了。
https://github.com/ant-design/ant-design-mobile/issues/1723
还有个比较重要的是listView的dataSource属性的参数问题需要注意一下,可以参考 https://reactnative.cn/docs/0.26/listviewdatasource.html
接下来就看一下具体的实现过程:
首先引入用到的组件
import { RefreshControl, ListView, Toast, List } from 'antd-mobile'
使用ListView,在ListView中使用RefreshControl
下拉刷新
上滑加载更多,实现分页