草庐IT

uni-getLocation

全部标签

记录--uni-app App端半屏连续扫码

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助本文用一个简单的demo讲解App端半屏连续扫码的实现方式,包括(条形码、二维码等各种各样的码)。我会从实现思路讲起,如果你比较急可以直接跳到动手实现章节获取代码。开发和运行环境开发工具:HBuilderX前端框架:uni-app我用了vue3的模式开发前端延伸能力:HTML5+运行环境:一加8(安卓手机)需求收集看到论坛上有人想在App端实现连续扫码功能。认真看了下图,还是个半屏的扫码框。 只是看到提了下需求,并没搜到多少解决方案。于是我去uni-app官网看了下,找到相关的内容:组件uni.scanCode扫码的API但组件不支持

记录--uni-app App端半屏连续扫码

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助本文用一个简单的demo讲解App端半屏连续扫码的实现方式,包括(条形码、二维码等各种各样的码)。我会从实现思路讲起,如果你比较急可以直接跳到动手实现章节获取代码。开发和运行环境开发工具:HBuilderX前端框架:uni-app我用了vue3的模式开发前端延伸能力:HTML5+运行环境:一加8(安卓手机)需求收集看到论坛上有人想在App端实现连续扫码功能。认真看了下图,还是个半屏的扫码框。 只是看到提了下需求,并没搜到多少解决方案。于是我去uni-app官网看了下,找到相关的内容:组件uni.scanCode扫码的API但组件不支持

uni-app项目|在弹窗中引入uchart图表子组件不显示

为了解决uchart作为子组件在主组件里引用但不显示的情况,(同样适用于弹窗之中)目前有三种方法。1-解决方式1>如果你使用的uchart子组件是从官方拿的例子:进入到uchart子组件将onReady或者onLoad(){}的方法的名字换成mounted。2>以父组件给子组件传值的方式给子组件的图表数据赋值。(官方不推荐的方式)  这种方式会使chartData原型链上增加额外的属性或方法,最终导致这些多余的属性或方法传入uCharts组件,带来预料不到的问题。实际上官方甚至都不推荐将uchart作为多层套娃的子组件。importEchartsBarfrom'@/components/car

uni-app项目|在弹窗中引入uchart图表子组件不显示

为了解决uchart作为子组件在主组件里引用但不显示的情况,(同样适用于弹窗之中)目前有三种方法。1-解决方式1>如果你使用的uchart子组件是从官方拿的例子:进入到uchart子组件将onReady或者onLoad(){}的方法的名字换成mounted。2>以父组件给子组件传值的方式给子组件的图表数据赋值。(官方不推荐的方式)  这种方式会使chartData原型链上增加额外的属性或方法,最终导致这些多余的属性或方法传入uCharts组件,带来预料不到的问题。实际上官方甚至都不推荐将uchart作为多层套娃的子组件。importEchartsBarfrom'@/components/car

uni-simple-router

目录uni-simple-router一、快速上手扩一:webpack插件之DefinePlugin扩二:uni-read-pages如何获取pages.json中的路由二、H5模式2.1路由配置2.2完全使用vue-router开发(H5端)2.3H5路由传参2.4H5端路由捕获所有路由或404路由2.5路由懒加载三、小程序模式四、路由跳转4.1组件跳转4.2编程式导航五、跨平台模式5.1提前享用生命周期5.2导航守卫六、路由守卫-模块化扩三、require.context用法uni-simple-router专为uniapp打造的路由器,和uniapp深度集成通配小程序、App和H5端H5

uni-simple-router

目录uni-simple-router一、快速上手扩一:webpack插件之DefinePlugin扩二:uni-read-pages如何获取pages.json中的路由二、H5模式2.1路由配置2.2完全使用vue-router开发(H5端)2.3H5路由传参2.4H5端路由捕获所有路由或404路由2.5路由懒加载三、小程序模式四、路由跳转4.1组件跳转4.2编程式导航五、跨平台模式5.1提前享用生命周期5.2导航守卫六、路由守卫-模块化扩三、require.context用法uni-simple-router专为uniapp打造的路由器,和uniapp深度集成通配小程序、App和H5端H5

uni-app如何实现USB插入后自动弹出对应软件

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助最近碰到了一个奇葩需求,要用uni-app来实现usb接入设备的时候,让软件自动弹出来,这里给出我制作的过程和参考的各种思路,希望对大家有所帮助一.插入usb自动弹出app因为uni-app代码里并不支持这个行为,我们需要用Android代码来制作对应功能具体本地打包步骤可以看我之前的文章点击前往1.在添加在res/xml文件夹下新建device_filter.xml 其中vendor-id和product-id为插入USB设备的生产厂家号和产品号,但插入(attached)上面列出的设备之一时就会弹出选择打开应用程序的对话框。注:上

uni-app如何实现USB插入后自动弹出对应软件

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助最近碰到了一个奇葩需求,要用uni-app来实现usb接入设备的时候,让软件自动弹出来,这里给出我制作的过程和参考的各种思路,希望对大家有所帮助一.插入usb自动弹出app因为uni-app代码里并不支持这个行为,我们需要用Android代码来制作对应功能具体本地打包步骤可以看我之前的文章点击前往1.在添加在res/xml文件夹下新建device_filter.xml 其中vendor-id和product-id为插入USB设备的生产厂家号和产品号,但插入(attached)上面列出的设备之一时就会弹出选择打开应用程序的对话框。注:上

记录--uni-app实现京东canvas拍照识图功能

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助最近公司出了一个新的功能模块(如下图),大提上可以描述为实现拍照完上传图片,拖动四方框拍照完成上传功能,大体样子如下图。但是我找遍了dcloud插件市场,找到的插件都是移动背景图片来实现裁剪的,跟京东的功能是相反的,没办法只能自己来实现这么一个插件。第一步首先就需要实现一个四方框的功能了。从上图可知,四方框有一下几个特点四个角粘连外框,随着框的大小和移动范围紧缚移动四方框可随意四个方向拖动方框外区域阴影不影响方框内那么我们根据这个特性来实现下这个功能,对于css规范的话使用bem规范/more$edge-border-width:6r

记录--uni-app实现京东canvas拍照识图功能

这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助最近公司出了一个新的功能模块(如下图),大提上可以描述为实现拍照完上传图片,拖动四方框拍照完成上传功能,大体样子如下图。但是我找遍了dcloud插件市场,找到的插件都是移动背景图片来实现裁剪的,跟京东的功能是相反的,没办法只能自己来实现这么一个插件。第一步首先就需要实现一个四方框的功能了。从上图可知,四方框有一下几个特点四个角粘连外框,随着框的大小和移动范围紧缚移动四方框可随意四个方向拖动方框外区域阴影不影响方框内那么我们根据这个特性来实现下这个功能,对于css规范的话使用bem规范/more$edge-border-width:6r