佛山公司建网站,长春制作手机网站,网站会员和discuz会员同步,新闻发稿平台本文介绍uni-app的textarea多行文本框组件、web-view组件、image图片组件、switch开关组件、audio音频组件、video视频组件。
一、textarea多行文本框组件 textarea组件在HTML 中相信大家非常熟悉#xff0c;组件的官方介绍见#xff1a;
textarea | uni-app官网uni-app,un… 本文介绍uni-app的textarea多行文本框组件、web-view组件、image图片组件、switch开关组件、audio音频组件、video视频组件。
一、textarea多行文本框组件 textarea组件在HTML 中相信大家非常熟悉组件的官方介绍见
textarea | uni-app官网uni-app,uniCloud,serverless,textarea,inputmode 有效值https://uniapp.dcloud.net.cn/component/textarea.html 这个比较简单看官方例子即可。
二、web-view组件 web-view组件相信大家在微信小程序开发中已经很熟悉了。就是用来承载网页的容器默认自动铺满整个页面如果使用native vue开发则需手工指定宽高。 web-view在H5中会转为iframe标签小程序端仅支持加载网络网页不支持加载本地网页。小程序端的web-view组件一定要有原生导航栏并且一定是全屏的web-view组件。App平台同事支持网络网页和本地网页但本地网页及js和css须放在uni-app项目根目录的/hybrid/html文件夹下。 web-view 的官方介绍见
web-view | uni-app官网uni-app,uniCloud,serverless,web-view,uni.postMessage(OBJECT),uni.getEnv(CALLBACK),App端web-view的扩展,web-view组件的层级问题解决,web-view组件的浏览器内核说明,UniAppJSBridgeRhttps://uniapp.dcloud.net.cn/component/web-view.html
三、image图片组件 image图片组件在H5中会转为img标签。官网介绍见
nulluni-app,uniCloud,serverless,image,图片格式说明,mode 有效值,示例https://uniapp.dcloud.net.cn/component/image.html
四、switch开关组件 switch开关选择器组件在实际开发中经常使用官网介绍见
switch | uni-app官网uni-app,uniCloud,serverless,switchhttps://uniapp.dcloud.net.cn/component/switch.html 五、audio音频组件 audio音频组件的官网介绍见
nulluni-app,uniCloud,serverless,audiohttps://uniapp.dcloud.net.cn/component/audio.html 在官网介绍中提到以下几点 微信小程序平台自基础库 1.6.0 版本开始不再维护 audio 组件推荐使用API方式而不是组件方式来播放音频。API见 uni.createInnerAudioContext 替代。 app-nvue也不支持此组件。 如果需要带ui的样式可以自己做也可以在插件市场搜索相关插件 本组件在vue3项目中废弃只可以在vue2项目中使用。 可以从插件市场搜索自己需要的音频组件DCloud 插件市场DCloud 插件市场https://ext.dcloud.net.cn/search?qaudio
六、video视频组件 video视频组件在H5平台支持MP4webm和ogg格式的视频。App平台支持本地视频mp4/flv、网络视频mp4/flv/m3u8以及流媒体视频rtmp/hsl/rtsp。 官方介绍见nulluni-app,uniCloud,serverless,videohttps://uniapp.dcloud.net.cn/component/video.html 如果大家开发短视频、培训类APP等需要深入研究video组件的使用。比如在video中加弹幕。
下面是示例代码 template view video :srcvideoUrl controls stylewidth:100%;height:500rpx; object-fitfill/video /view /template
script export default { name: video-component, data(){ return { videoUrl:http://xxxx/video/demo.mp4 } } } /script
style scoped
/style
