草庐IT

uni-file-picker文件选择上传

基础用法mode="grid",可以使用九宫格样式选择图片limit="1",则最多选择张图片file-mediatype="image",限定只选择图片file-extname='png,jpg',限定只选择png和jpg后缀的图片auto-upload="false",可以停止自动上传,通过ref调用upload方法自行选择上传时机。与ref="files"搭配使用,this.$refs.files.upload()。exportdefault{data(){return{imageValue:[]}},methods:{//获取上传状态select(e){console.log('选择文

uni-app6种跳转方式

1、uni.navigateTo:保留当前页面,跳转到应用内的某个页面。2、uni.redirectTo:关闭当前页面,跳转到应用内的某个页面。3、uni.reLaunch:关闭所有页面,打开到应用内的某个页面。4、uni.switchTab:跳转到tabBar页面,并关闭其他所有非tabBar页面。5、uni.navigateBack:关闭当前页面,返回上一页面或多级页面。6、uni.preloadPage:预加载页面,是一种性能优化技术。被预加载的页面,在打开时速度更快。

uni-app小程序报错Error: ENOENT: no such file or directory, open ‘F:\HBuilderProjects\uni_proj3\subpkg\sea

uni-app报错: Error:ENOENT:nosuchfileordirectory,open'F:\HBuilderProjects\uni_proj3\subpkg\search\search.vue'解决办法:找到pages.json配置文件,删除styl里面的内容即可,错误原因是分包创建时会自动给该分包添加style,下次再创建分包记得先删除掉styl里的配置内容

VUE(uni-app框架)开发微信小程序③-显示隐藏

uni-app控制显示隐藏的方式有两种,【v-if】 和  【v-show】v-if:通过控制虚拟dom树的节点来达到控制式样的显示和隐藏,当参数为false的时候,该节点被删掉,当为true的时候则显示。v-show:通过css样式中的dispaly:none来控制元素的显示和隐藏代码如下: v-if隐藏 v-if显示 ------------------------------------ v-show隐藏 v-show显示 显示效果如下: 通过右边Wxml的代码,我们发现v-if隐藏已经不见了,只有v-if显示,可是v-show隐藏和v-show显示都在,可是左边的显示都达到

uni-app——使用uni.navigateTo传递对象参数

文章目录一、传递一般参数二、传递对象参数1.传递参数2.接收参数一、传递一般参数constindex=1;uni.navigateTo({ url:`../address/address?key=${index}` })二、传递对象参数1.传递参数//跳转到订单详情页面 toOrder(item){ //console.log(item.hpv_id,'hpv_id') uni.navigateTo({ url:'../hpvOrder-detail/hpvOrder-detail?key='+encodeURIComponent(JSON.stringify(item

uniapp uni-icons 组件为例 带着大家使用并熟悉一次文档

uni的组件都可以直接进入官网https://uniapp.dcloud.net.cn/然后点击右上角的搜索直接在输入框中搜索uni-icons下面内容就都出来了在最上面先点击下载和按在进入界面后点击箭头指向出进行下载如果你系统有HBuilderX就会自动打开要你选择安装在哪一个项目里如果你的HBuilderX有项目在运行则无法安装安装成功后我们继续回到刚才的文档先看下面的API看看每个字段都是干什么的这里我们只需要两个size控制尺寸大小的type控制图标的方案类型他让我们参考案例然后我们看案例这里就有非常多的图标给我选最上面就是基础用法那么我们就可以理解为uni-iconstype="图标

uni-app微信小程序——下拉多选框

插件来自:select-cy-DCloud插件市场 1、组件代码{{item}}{{placeholder}}{{item[slabel]}}exportdefault{name:'select-cy',props:{//是否显示全部清空按钮showClearIcon:{type:Boolean,default:false,},//是否显示单个删除showValueClear:{type:Boolean,default:true,},zindex:{type:Number,default:999,},//禁用组件disabled:{type:Boolean,default:false,},op

uni-app px与rpx的转换

第一种转换方法:由rpx的微信官方介绍可知rpx(responsivepixel):可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在iPhone6上,屏幕宽度为375px,共有750个物理像素,则750rpx=375px=750物理像素,1rpx=0.5px=1物理像素。由此得知是以750物理像素为基准:px/rpx=screenWidth/750由此得知:rpx=(750px)/screenWidthpx=(screenWidthrpx)/750//rpx转pxrpxToPx(rpx){ constscreenWidth=uni.getSystemInfoSync().screen

关于微信小程序uni.uploadFile上传报错---请求拦截---errMsg:“uploadFile:fail createUploadTask:fail invalid url“

使用uni.chooseImage选择图片,uni.uploadFile上传图片时,发现了上面这句报错翻译了一下,是说我url地址没完整,于是我就把基地址加在了前面后面又说我token没携带,我又返回去看http的请求拦截,是有统一携带token的uni.addInterceptor然后发现是uni-app请求拦截方法,只会拦截我所给的参数,我写了request,他就只拦截了request,不会再管uploadFile了手动添加基地址和token即可constchooseImage=()=>{uni.chooseImage({count:1,//默认9success(res){uni.uplo

在 WebStorm 中开发 uni-app - 用vue2实现手机APP(apk) + 微信小程序项目开发方案

主要是跟vue2相关的开发环境与框架。本人选型方案结合自身知识系统(vue2,webstorm),综上相关框架了解,选择了以下方案:开发环境:HBuilderX + Webstorm框    架:Uni-app(NVue)+ Vue2  webstorm开发的uniapp+hbuilderx进行app 小程序打包使用vue2CLI创建uni-app项目vue2环境,node.js, cli脚手架必须要有,这里就不详说了。模版名字这个是固定,必须要输入:dcloudio/uni-preset-vue创建一个新目录,window终端执行以下语句vuecreate-pdcloudio/uni-pre