接口学习【界面-未(下班前进行重点内容的修改概括)】"/>
uniapp-接口学习【界面-未(下班前进行重点内容的修改概括)】
.html
回去需要看的
[休息]
题目积累
输入m.n参数,获取一个m长度的都是n的数组,不能用循环。
1-1设置界面标题:【uni.setNavigationBarTitle】
<template><view><form @submit="setNaivgationBarTitle"><view><view>页面标题</view><view><input type="text" name='title' placeholder="请输入页面标题并点击设置即可"></view></view><view><button type="primary" formType="submit">设置</button></view></form></view>
</template><script>
// export用于对外输出本模块(一个文件可以理解为一个模块)变量的接口
// import用于在一个模块中加载另一个含有export接口的模块。export default {data() {return {}},methods: {setNaivgationBarTitle:function (e) {let title=e.detail.value.title// 动态设置当前页面的标题。uni.setNavigationBarTitle({title:title,success:()=>{console.log('setNavigationBarTitle success')},fail:(err)=>{console.log('setNavigationBarTitle fail, err is', err)}})}}}
</script><style></style>
1-2【页面调转方式】
navigateTo() {//保留当前页面,跳转到应用内的某个页面uni.navigateTo({url: 'new-page/new-page?data=Hello'})},navigateBack() {//返回到原页面uni.navigateBack();},redirectTo() {//关闭当前页面,跳转到应用内的某个页面。uni.redirectTo({url: 'new-page/new-page'});},switchTab() {//跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。uni.switchTab({url: '/pages/tabBar/template/template'});},reLaunch() {//关闭所有页面,打开到应用内的某个页面。【一般用于退出登录页】uni.reLaunch({url: '/pages/tabBar/component/component'});}
1-3【下拉刷新–不是很懂】
<template><view><!-- <page-head :title="title"></page-head> --><view><view class="text" v-for="(num,index) in data" :key="index">list-{{num}}</view><view v-if="showLoadMore">{{LoadMoreText}}</view></view></view>
</template><script>export default {data() {return {// title: '下拉刷新+加载更多'data:[],LoadMoreText:"加载中",showLoadMore:false,max:0} },onLoad() {this.initData();},onUnload() {this.max=0,this.data=[],this.LoadMoreText="加载更多",this.showLoadMore=false},onReachBottom() {console.log("onReachBottom");if(this.max>40){this.LoadMoreText="没有更多数据了!"return;}this.showLoadMore=true;setTimeout(()=>{this.setDate();},300);},onPullDownRefresh() {console.log('onPullDownRefresh');this.initData();},methods: {initData(){setTimeout(()=>{this.max=0;this.data=[];let data=[];this.max+=10;for(var i=this.max-9;i<this.max+1;i++){//push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。data.push(i)}
// concat() 方法用于连接两个或多个数组。
// 该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。this.data=this.data.concat(data);uni.stopPullDownRefresh();},300);},setDate() {let data = [];this.max += 10;for (var i = this.max - 9; i < this.max + 1; i++) {data.push(i)}this.data = this.data.concat(data);}}}
</script><style>.text {margin: 16upx 0;width:100%;background-color: #fff;height: 120upx;line-height: 120upx;text-align: center;color: #555;border-radius: 8upx;border: 1upx solid;}
</style>
1-4【显示操作菜单】
<template><view><view><button @tap="actionSheetTap">弹出action sheet</button></view></view>
</template><script>export default{data() {return{}},methods: {actionSheetTap() {uni.showActionSheet({itemList:['item1','item2','item3','item4'],//success返回参数说明// tapIndex Number 用户点击的按钮,从上到下的顺序,从0开始success:(e) =>{console.log(e.tapIndex);uni.showToast({title:"点击了第"+e.tapIndex+"个选项",icon:"none"})}})}}}
</script><style></style>
1-5【】
更多推荐
uniapp-接口学习【界面-未(下班前进行重点内容的修改概括)】
发布评论