草庐IT

uniapp仿微信朋友圈发布页(原生uni方法不使用扩展组件)

前言:常见的一些UI组件库都是只能提前选择发布图片或者发布视频,我觉得在发布前还要选择一下,挺麻烦的。虽然微信朋友圈也是这么做的吧。我希望的是,直接进入发布页,如果没有选择图片或者视频,也可以直接发布文字,选择媒体的话支持拍照、图片、视频三个选项。如果选择了图片,就不能选择视频,如果选择了视频就不能选择图片。且图片最多选择9张,视频最多选择一个。下面将分享实际思路实现以及参考代码(完整代码在本文末尾)思路:页面放置相机icon,绑定点击事件使用uni.showActionSheet从下弹出选择菜单,模拟微信配置拍照,从相册选择照片,从相册选择视频三个选项编写每个选项具体的操作方法实现最多选择9

uniapp开发微信小程序-用户授权登录和获取手机号码

 小程序开放文档uniapp开发的小程序配置,找到manifest.json,填入正确的小程序appId;hbuilderx>运行>运行到小程序模拟器(安装开发者工具),编译完成之后会直接在微信开发者工具内打开; 登录流程解析:判断用户是否登录,如果未登录需重新授权,已登录直接跳转进入小程序;uni.getUserProfile弹出微信授权窗口,获取用户信息;uni.login登录成功获取code,传给后端;创建getPhoneNumber按钮,用户允许后(需要用户操作),获取code,传给后端; 核心代码:1、判断用户是否登录onLoad(){ //#ifdefMP-WEIXIN const

uniapp开发:瀑布流 灵活配置 简单易用 兼容vue2vue3小程序、H5、app等多端

概要支持的平台使用方式属性说明事件说明组件方法refresh的使用示例隐藏单项图片示例完整示例温馨提示关注我,不迷路概要custom-waterfalls-flow是一个瀑布流插件,灵活配置、简单易用、兼容多端、同时兼容vue2和vue3。最近在做项目的时候需要用到瀑布流,于是在插件市场找了一些,下载量最高的是用了定位来做的,我认为瀑布流可以不用定位去实现,于是我就自己写了该插件。经过反复的测试优化,最终搞定!设置列数:瀑布流的列数可以通过参数直接控制,实时监听,随改随生效。列数最小为2,最大默认为5,可以通过maxColumn参数去控制最大列数,理论上可以设置无限大,具体值自己拿捏。更新数据

【uniapp微信小程序】如何将uni目录下static里的txt文件内容展示在页面上?

实现uni目录下static里的txt文件内容展示在页面上一、需求:二、实现原理:三、实现步骤及相关代码:1.首先在`static`文件夹下,创建一个`txt`文件,比如说文件名为content.txt。2.在页面的script标签中使用uni.request方法,以GET请求的方式获取该文件的内容。四、代码解释:五、注意事项:一、需求:uniapp框架中,可以通过使用vue的方式将static下的txt文件内容展示在页面上。二、实现原理:实现该功能需要先将txt文件放在static目录下,然后通过uni-app自带的HTTP请求方法将该文件的内容获取到,最后在页面上进行展示。三、实现步骤及相

uniapp - 如何跟内嵌 web-view 组件内的网页交互,与 web-view 内嵌网页进行双向通信(uniapp 与 webview 网页之间的 “相互“ 传值)提供详细的示例代码及解决方案

介绍这种需求很少,本文提供了详细的代码示例与解决方案,代码简洁注释多!本文实现了uniapp项目与web-view组件内嵌的普通网页(无论任何),实现“双向通信”二者相互发送、监听数据,例如如下uniapp项目的一个页面,要与其webview内嵌的网页进行通讯:其中web-view指定了一个url地址,后续即是将url地址加载的html页面与uniapp内部的vue页面进行交互。

uniapp使用高德地图地理位置逆解析/将获取到的经纬度转化为地址

1、在高德登录注册,进行个人或企业开发者认证(个人开发者可以随时升级企业开发者)高德地图开发aip网址2、进入控制台,按以下图示操作添加完成之后把key复制一下。3、使用uni.request进行请求(用什么框架就这么请求,这里示例的是uniapp),请求地址为:https://restapi.amap.com/v3/geocode/regeo?output=JSON&location=经度,纬度&key=刚才复制的key值 获取的结果即为解析出来的地址。思路:首先使用uni.chooseLocation获取一个地图上指定的经纬度,然后通过高德地图逆解析的api进行逆解析来获得详细地址。附上代

uniapp 微信小程序 ui-table 表头固定,可缩放,实现

效果图表头固定,可缩放效果前言用到的组件:使用uniapp内置组件movable-view和movable-area实现表格缩放使用uni-table实现表格渲染(自带多选,没有头固定功能)开始探索实现表头固定功能,看到网上使用sticky定位封装table组件,需要自己另外实现多选等一些事件监听功能,单元格动态设置高度。可是我想偷懒,并且现在情况就是我不偷懒尝试去实现还是会遇到如下一些问题情况一:表头和表体分开控制,表体进行缩放,列头名称和列数据不能一一对应,左右拖动和缩放表体过程中会导致表头名称与表体数据不对应的问题。并且由于手机宽度有限,用户要单独左右滑动才能看到全部表头内容情况二:表头

uniapp 微信小程序 ui-table 表头固定,可缩放,实现

效果图表头固定,可缩放效果前言用到的组件:使用uniapp内置组件movable-view和movable-area实现表格缩放使用uni-table实现表格渲染(自带多选,没有头固定功能)开始探索实现表头固定功能,看到网上使用sticky定位封装table组件,需要自己另外实现多选等一些事件监听功能,单元格动态设置高度。可是我想偷懒,并且现在情况就是我不偷懒尝试去实现还是会遇到如下一些问题情况一:表头和表体分开控制,表体进行缩放,列头名称和列数据不能一一对应,左右拖动和缩放表体过程中会导致表头名称与表体数据不对应的问题。并且由于手机宽度有限,用户要单独左右滑动才能看到全部表头内容情况二:表头

【uniapp】H5和小程序动态导入模块的方法

做uniapp项目通常都是用importModulefrom"./../module.js"方式引用模块的,但是,这种方式是静态的,还是只能放在执行代码段的顶部(或者外部),若想放在代码中执行,那就会报错的,来看看如何解决吧。各平台支持差异方法名H5微信小程序import()√×require()×√现在知道,H5项目可以用import().then()动态引入模块,而微信小程序就用require()动态导入。在导入模块前,模块文件里的定义方式是这样的,代码如下consttemplate1={};//...exportdefault{ template1}考虑到两个不同平台,就改成按条件编译,

【uniapp】H5和小程序动态导入模块的方法

做uniapp项目通常都是用importModulefrom"./../module.js"方式引用模块的,但是,这种方式是静态的,还是只能放在执行代码段的顶部(或者外部),若想放在代码中执行,那就会报错的,来看看如何解决吧。各平台支持差异方法名H5微信小程序import()√×require()×√现在知道,H5项目可以用import().then()动态引入模块,而微信小程序就用require()动态导入。在导入模块前,模块文件里的定义方式是这样的,代码如下consttemplate1={};//...exportdefault{ template1}考虑到两个不同平台,就改成按条件编译,