分类：uni-app

2020
12-14

uni-app 自定义底部导航栏的实现

这是我目前发现较好的uni-app自定义底部导航栏方法，其他方法的缺点主要是在切换时，要么会闪烁，要么会每点击一下，都会请求一次数据。如果有其他更好的方法，欢迎评论留言，最近才开始用uni-app写项目，之前只是看了下文档。1.tabbar组件<template><viewclass="tabbar-container"><view:style="{color:currentIndex==index?'#007EFF':'#333333'}"v-for="(item,index)intabbarList":key="index"... 继续阅读 >

2020
10-08

uniapp,微信小程序中使用 MQTT的问题

最近在uniapp打包成微信小程序的项目中第一次用到了MQTT。使用比较简单，但是还是遇到了一些问题。在此记录一下。官方文档：MQTTGithub官方MQTT测试工具：MQTTX。测试工具使用说明MQTT的js文件：mqtt.min.js先上一点注意事项：（1）MQTT.js一个MQTT协议的客户端库，用JavaScript编写，可用于Node.js和浏览器。在Node.js端可以通过全局安装使用命令行连接，同时还支持MQTT，MQTTTLS证书连接；值得一提的是MQTT.js还... 继续阅读 >

2020
10-08

VSCode 配置uni-app的方法

CＬＩ工程全局安装vue-clinpminstall-g@vue/cli通过cli创建uni-app项目 vuecreate-pdcloudio/uni-preset-vueuni-app选择项目模板，可自由选择如下图：👇使用vscode打开创建的项目安装vue语法提示插件👇cli工程自带uni-app&5+app语法提示安装组件语法提示npmi@dcloudio/uni-helper-json从git下载uni-app代码块，放到项目目录下的.vscode目录即可拥有和HBuilderX一样的代码块。使用scss样式#先... 继续阅读 >

2020
09-29

uni-app使用微信小程序云函数的步骤示例

创建云函数目录首先，我们需要在uni-app项目文件夹下，创建一个云函数目录，路径随意，我这里是functions。然后先随便在里面放一些文件，这里以new_file.css为例。(放文件的原因是：确保编译成小程序后cloudfunctions文件夹存在。如果该文件夹下没有文件，默认是不会在微信小程序开发平台中显示该文件夹的。)修改manifest.json在uni-app根目录下，修改manifest.json中的微信小程序项，结构如下"mp-weixin":{/*小程序特有相... 继续阅读 >

2020
09-29

uni-app从安装到卸载的入门教程

uni-app实现了一套代码，同时运行到多个平台。支持iOS模拟器、Android模拟器、H5、微信开发者工具、支付宝小程序Studio、百度开发者工具、字节跳动开发者工具工具安装开发uni-app需要安装HBuilderX.下载地址。下载成功后直接解压即可简单的配置一下开发偏好：创建第一个uni-app点击左上角【文件】>>【新建】>>【项目】，选择uni-app模板。uni-app目录结构目录结构基本和小程序的目录结构相似，只是多了个基础组件的文件夹；uni-ap... 继续阅读 >

2020
09-28

uni-app如何页面传参数的几种方法总结

uni.$emit(eventName,OBJECT)触发全局的自定事件。附加参数都会传给监听器回调。其中eventName为事件名，OBJECT为触发事件附加参数示例代码如下：uni.$emit('update',{msg:'页面更新'})uni.$on(eventName,callback)监听全局自定义事件，事件由uni.$emit()触发，回调函数会接收所有传入的数。eventName为事件名，callback为事件的回调函数。示例代码如下：uni.$on('update',function(data){console.log('监听到事件来自up... 继续阅读 >

2020
09-25

十步搞定uni-app使用字体图标的方法

uni-app简介uni-app是一个使用Vue.js开发跨平台应用的前端框架，开发者编写一套代码，可编译到iOS、Android、H5、小程序等多个平台。  uni-app框架由Dcloud即数字天堂(北京)网络技术有限公司推出，该公司主要产品有Web开发IDEHbuiler、HbuilderX，前端框架mui、uni-app，增强版的手机浏览器引擎H5plus等。uni-app中使用字体图标图标的下载首先去阿里图标库选择要用的图标，并且打包下载下来，步骤如下1.2.3.4.5.6.本... 继续阅读 >