百度360必应搜狗淘宝本站头条
当前位置:网站首页 > IT知识 > 正文

uni-app基于vue开发小程序与标准vue开发新增点

liuian 2025-02-17 13:04 40 浏览

1、路由跳转传参

uni.navigateTo({

url: `/pages/transition/spreadTextAction?t=${this.options.t}&rt=${this.options.rt}&l=${this.options.l}`

});

uni.navigateBack({

delta: 1 //返回的页面数,如果 delta 大于现有页面数,则返回到首页。

});

2、cover-view 、cover-image

cover-view: 覆盖在原生组件上的文本视图。为了优化体验,部分组件如map、video、textarea、canvas通过原生控件实现,原生组件层级高于前端组件(类似flash层级高于div)。

cover-image: 覆盖在原生组件上的图片视图。可覆盖的原生组件同cover-view,支持嵌套在cover-view里。支持的事件:click。属性名:src、@load、@error。

tip: 1、App端vue页面cover-view、cover-image中不支持嵌套其它组件,包括再次嵌套cover-view,仅可覆盖video、map。App端nvue页面自2.1.5起没有这些限制。

3、小程序原生分享

// 页面处理函数--用户点击右上角分享

onShareAppMessage() {

return Util.shareMessage(this.options.t, this.options.rt, this.options.l, this.bannerData.studentName, this.bannerData.subject);

}

function shareMessage(t, rt, l, name, subject) {

const copywriting = {

11: `${name}个性化学习规划,了解一下`,

13: `${name}的${subject}学科诊断报告,了解一下`,

14: `${name}的${subject}学科诊断报告,了解一下`,

15: '基因诊疗学习法,了解一下'

};

console.log(`/pages/index/index?t=${t}&rt=${rt}&l=${l}&isShare=true`);

return {

title: copywriting[rt],

path: `/pages/index/index?t=${t}&rt=${rt}&l=${l}&isShare=true`

};

};

4、image标签的mode属性:图片裁剪、缩放的模式

5、动态绑定类名

:class="{'uni-bg-blue': tabNames[activeNameIndex] ==='易错点',

'uni-bg-red': tabNames[activeNameIndex] === '提分点',

'uni-bg-orange': tabNames[activeNameIndex] === '重点'}";

6、小程序页面生面周期:

// 页面周期函数--监听页面加载

onLoad() {

},

// 页面周期函数--监听页面初次渲染完成

onReady() {},

// 页面周期函数--监听页面显示

onShow() {},

// 页面周期函数--监听页面隐藏

// 页面周期函数--监听页面卸载

onUnload() {},

// 页面处理函数--监听用户下拉动作

onPullDownRefresh() {},

// 页面处理函数--监听用户上拉触底

onReachBottom() {}

// 页面处理函数--监听页面滚动

/* onPageScroll(event) {}, */

// 页面处理函数--用户点击右上角分享

/* onShareAppMessage(options) {}, */

7、uni-app打电话

uni.makePhoneCall({

phoneNumber: e.currentTarget.dataset.phone,

success: function() {

console.log('call ok');

}

});

8、findIndex

const index = dataArr.findIndex(v => v.id === item.moduleId);

9、设置导航title

uni.setNavigationBarTitle({

title: this.module.title

});

10、tap和click的区别

  • tap和click都是点击事件。不过移动端有太多复杂的功能是click监听不到的,例如,触摸、按住和轻滑。这时候就要用tap方法了。
  • 另外,click事件是点击放开之后才触发的,所以时间上会有延迟,大概200-300ms这样,可是我们在移动端的话就比较追求速度,所以就不能出现说有延迟的情况。所以用tap来代替click事件的话,对于针对移动设备的产品都适合。
  • 而且,tap还有一个特点就是『事件穿透』,就是你执行完绑定的tap事件之后呢,如果下面如果绑定了其他事件或者是本身就存在点子事件的话,也会默认触发。

相关推荐

qq对战平台官方版(qq对战平台什么时候开放)

在我的电脑文件夹里面先打开War进游戏,然后退出,再用腾讯对战平台打开就可以打开了,不用谢我啦,祝各位玩的愉快啦,睡觉去了~~~~~~~~顺便说下,我的ID是九尾人柱力,玩的可以加我首先安装IPX协...

tp link路由器手机设置教程(tp-link路由手机设置)
  • tp link路由器手机设置教程(tp-link路由手机设置)
  • tp link路由器手机设置教程(tp-link路由手机设置)
  • tp link路由器手机设置教程(tp-link路由手机设置)
  • tp link路由器手机设置教程(tp-link路由手机设置)
破解qq空间(破解qq空间访问权限的软件)

空间设置了访问权限,所以不是好友,或是不知道问题密码的人,是进不去的!没有可以强行进入的方法,因为涉及他人隐私问题,除非本人对你开放。一般限制访问QQ空间访问权限会有三种情况:1、仅自己。2、QQ...

手机怎么把qq空间关了(手机qq空间怎么关掉)
  • 手机怎么把qq空间关了(手机qq空间怎么关掉)
  • 手机怎么把qq空间关了(手机qq空间怎么关掉)
  • 手机怎么把qq空间关了(手机qq空间怎么关掉)
  • 手机怎么把qq空间关了(手机qq空间怎么关掉)
联想win7原版(联想正版win7原版)

要还原联想笔记本自带的Win7系统,首先需要进入电脑的BIOS界面,将启动项设置为光驱或U盘。然后将联想笔记本自带的恢复盘或安装盘插入电脑,并重启电脑。接着按照提示进行操作,选择还原系统选项,等待系统...

bonjour软件有用吗(bonbon是啥软件)

1.bonjour软件是苹果公司在其开发的操作系统MacOSX10.2版本之后引入的服务器搜索协议所使用的一个商标名。2.安装了类似的itunes的软件以后,电脑上就会出现Bonjour软件...

笔记本电脑开机蓝屏无字(笔记本屏幕蓝屏什么字也没有)

初步怀疑是电脑温度过高导致的问题。出现蓝屏毛病的原因很多:1、电脑蓝屏是由于病毒破坏系统文件,导致系统故障进而出现蓝屏。2、电脑超频过度引起电脑蓝屏,这也可能涉及到下面的温度过高引起的蓝屏。3、内存条...

文件格式转换器免费版(文件格式转换器免费版下载安装)

一般来说,使用全能格式转换器转换文件的步骤大致如下:1.打开全能格式转换器,并点击“添加文件”按钮,选择您要转换的文件。2.在“输出格式”选项中,选择您想要将文件转换成的格式。3.如果需要,您可...

口碑最好的随身wifi品牌(随身wifi十大排名)

哪个牌子最好用性价比最高一目了然!格行设备价格:69/99/109/139/168(性价比高)芯片:进口马维尔芯片套餐:双网设备,套餐价格一致,随用随充续航:3000毫安18小时左右 33...

新买的台式电脑没声音(新买的台式机没有声音)

解决方法如下:1、查看主板的声卡驱动装没装上。2、驱动装好了,在右下角的小喇叭有没有,如果有,鼠标放在上面,右击就会看到声音的各种设置,如果没看到小喇叭,进入设备管理器看一下声音的硬件上是否有黄色标记...

dlink路由器设置密码步骤(dlink路由器设置教程)
  • dlink路由器设置密码步骤(dlink路由器设置教程)
  • dlink路由器设置密码步骤(dlink路由器设置教程)
  • dlink路由器设置密码步骤(dlink路由器设置教程)
  • dlink路由器设置密码步骤(dlink路由器设置教程)
三星笔记本u盘启动快捷键(三星笔记本u盘启动设置)

开机出现“SAMSUNG”画面时按F2进入BIOS设置,找到【Advanced】选项下,将快速启动“FastBIOSMode”项选为“Off”2.按F10键保存退出并重启,插入U盘,再次按F2键进入B...

普联无线路由器设置(普联路由器上网设置)

关于这个问题,以下是普联无线路由器的设置步骤:1.首先,将您的普联无线路由器与电脑或笔记本电脑连接。2.打开您的浏览器,输入路由器的IP地址(通常为192.168.1.1或192.168...

光盘映像文件怎么打开运行(光盘映像文件是干嘛的)
  • 光盘映像文件怎么打开运行(光盘映像文件是干嘛的)
  • 光盘映像文件怎么打开运行(光盘映像文件是干嘛的)
  • 光盘映像文件怎么打开运行(光盘映像文件是干嘛的)
  • 光盘映像文件怎么打开运行(光盘映像文件是干嘛的)
万兴数据恢复专家免费版(万兴数据恢复专家app)

手机版本目前还在开发当中,目前只有电脑版本跟网页版万兴数据管家,非常靠谱!这是一款专门针对苹果微信数据管理的软件,能够恢复苹果手机聊天记录、聊天记录备份、聊天记录导出!支持微信免费备到本地电脑,包括聊...