uni-app
uni-app实现类似confirm提示框的效果
uni.showModal({ title: '提示', content: '这是一个模态弹窗', success: function (res) { if (res.confirm) { console.log('用户点击确定'); } else if (res.cancel) { console ......
uni-app接口请求封装
首先根目录下新建文件夹取名随意，这里我取名common（意为：常见的、共有的） 然后新建request.js文件，贴入以下代码 let server_url = ''; //请求根路径（服务器地址）let token = '';//token令牌// process.env.NODE_ENV 'de ......
uni-app 介绍及使用
一、什么是uni-app uni-app由dcloud公司开发的多端融合框架，是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。最大的优势 ......
uni-app:input的样式调整(hbuilderx 3.7.3)
一，js代码： <template> <view> <input class="inputText" style="width:700rpx;height:76rpx;" v-model="mobile" placeholder="请输入手机号" ></input> <view style="dis ......
uni-app中IM的发送的修改以及回滚底部的修改
在使用的过程中发现输入文字之后没有相关的发送按钮，所以对TUIKit/TUIPages/TUIChat/components/message-input/index.vue做微调，如下微调内容： 添加@input方法 <input class="TUI-message-input-area" :ad ......
uni-app小程序添加IM聊天以及音视频
uni-app开发小程序的过程中，需要继承IM的聊天以及音视频功能，因为我是放在分包里的， 步骤如下： 按照文档要求，然后在相关的界面引用就可以了。 音视频引入： 这里引入之后还有一个问题是你必须每次在微信开发工具构建npm一下，具体操作如下： 在微信开发工具终端依次输入如下指令： npm init ......
uni-app 踩坑之旅2
首先是 axios ，拿到 uni-app 测试项目中，不好使，需要改成自带的 uni.request 请求，于是乎重新封装了下 request：https://uniapp.dcloud.net.cn/api/request/request.html import { getItem, remov ......
uni-app 网络请求
一、网络请求 在uni中可以调用uni.request方法进行请求网络请求需要注意的是：在小程序中网络相关的 API 在使用前需要配置域名白名单。 配置请求 一下为发送网络请求的基本配置，可根据接口请求数据方法的不同，以不同的方式请求数据 var baseURL = "/api" var baseU ......
uni-app vue2升级vue3过程中遇到的问题总结
首先是在升级的过程中，项目跑不起来，相关的问题不贴图了，解决办法简单粗暴，就是卸载，重装最新版Hbuilder X。可以解决一大部分问题。 再次，会出现如下报错： 是因为我在main.js中app.use 的问题，直接注释。然后发现还有如下问题： 排查了好久才发现，是因为写在app.vue中的检测小 ......
uni-app:app:锁定屏幕方向禁止屏幕旋转(hbuilderx 3.7.3)
一，第一种方法：js代码: App.vue <script> export default { onLaunch: function() { console.warn('当前组件仅支持 uni_modules 目录结构 ，请升级 HBuilderX 到 3.1.0 版本以上！') console.l ......
uni-app（5）
uni-app（5） static 目录下的文件不会被编译，如果这里面有 es6 代码，不经过转换直接运行，则会报错；同样的，less、scss 等资源也不要放入这里面 根目录中的 uni.scss 会自动引入 uni-app 完整支持 Vue 里面的生命周期，此外，还包括它本身的 应用生命周期 和 ......
uni-app:npm安装js-md5第三方库(hbuilderx 3.7.3 / npm 9.5.0)
一，安装js-md5第三方库: 1，执行npm命令: liuhongdi@liuhongdideMacBook-Pro poem % npm install --save js-md5 added 1 package in 460ms npm notice npm notice New minor ......
uni-app 踩坑之旅1
有移动端需求，正好趁此机会学学 uni-app 先下载个 hello 模板看一看：https://ext.dcloud.net.cn/plugin?id=4941 然后按照教程学习：https://uniapp.dcloud.net.cn/tutorial/ 使用模板创建个新项目，引入官方 css ......
Taro架构构析(1)：多端框架分析，Taro WePY uni-app对比
像Qt 和 Flutter 从底层的渲染引擎 布局引擎 中层的 DSL，再到上层的框架全部由自己开发 ，研发成本巨大。React Native 和 Weex 没有渲染引擎，渲染的一致性无法保证。JS 和 Native 之间需要通信延迟等。Taro WePY uni-app抹平小程序之间 ......
微信小程序 开发,uni-app 开发简介
微信小程序 开发相关知识点 1.如何创建小程序 微信开发者工具，appid,微信公众平台，创建小程序 2.小程序项目基本组成结构 app.js 小程序入口文件;app.json小程序配置文件；app.wxss全局样式文件；pages小程序页面 3.小程序页面构成部分 .wxml页面结构,.wxss页 ......
uni-app去掉导航栏
在package.json中添加这句 "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages { "path": "pages/index/index", "style": { "navigation ......
uni-app 日历组件的实现
uni-app 日历组件的实现 以下是一个基于 uni-app 的简单日历组件实现代码，包括了日历的基本布局和日期选择功能： <template> <view class="calendar"> <view class="calendar-header"> <view class="calendar ......
uni-app 弹出层组件的实现
uni-app 弹出层组件的实现 以下是一个简单的 uni-app 弹出层组件的实现代码示例，它可以根据传递的属性来控制弹出层的显示和隐藏： <template> <view class="overlay " v-show="visible" @click="close" :class="{ 'ce ......
uni-app:nvue:配置底部安全区域(hbuilderx 3.7.3)
一，文档地址: https://uniapp.dcloud.net.cn/collocation/manifest-app.html#full-manifest 如图: 说明：offset:底部安全区域偏移， "none"表示不空出安全区域， "auto"自动计算空出安全区域 二，编辑配置文件: m ......
uni-app 滚动通知组件的实现
uni-app 滚动通知组件的实现 一、实现思路 二、使用scroll-view 组件实现 <template> <view class="notice"> <scroll-view class="notice-scroll" :scroll-y="true" :scroll-with-animat ......
uni-app:nvue:居左/居右/居中对齐(hbuilderx 3.7.3)
一，代码: 居中: <view style="position: fixed;bottom:0;width:750rpx;height: 60rpx; display: flex;flex-direction: row;justify-content:center;"> <span>{{appNam ......
半天时间写完一个案例，循序渐进的掌握uni-app，使用uni-app完成一个简单项目——新闻列表
一、创建项目 uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。 uni-app在手，做啥都不愁。即使不跨端，uni-ap ......
小程序原生 转 uni-app
1. 下载miniprogram-to-uniapp npm install miniprogram-to-uniapp -g 2. 项目下打开终端 wtu -i "你的小程序项目路径" 如：wtu -i "G:wx_project" 回车后: 在项目根目录出现一个后缀为_uni的目录 -- 就是转 ......
uni-app:ios/android中的nvue和vue页面加载自定义字体(hbuilderx 3.7.3)
一，官方文档地址: https://uniapp.dcloud.net.cn/tutorial/nvue-api.html#addrule 二，代码 1,nvue页面: 模板 <view class="listTitle"> {{item.title}} </view> <view style="w ......
uni-app:tabbar自定义中间凸起按钮的tabbar(hbuilderx 3.7.3)
一，官方文档地址: https://uniapp.dcloud.net.cn/collocation/pages.html#tabbar https://uniapp.dcloud.net.cn/api/ui/tabbar.html#ontabbarmidbuttontap 二，代码 1，pages ......
uni-app框架
1. uni-app简介 uni-app 是一个使用vue的语法 + 微信小程序的标签和API的跨平台前端框架，开发者编写一套代码，可编译到iOS、Android、H5、小程序等多个平台，几乎覆盖所有流量端，uni-app 具有跨端数量更多、性能体验更优秀、学习成本低、开发成本低等几大关键优势。 2 ......
uni-app:微信小程序:预加载字体文件(hbuilderx 3.7.3)
一，官方文档地址: https://uniapp.dcloud.net.cn/api/ui/font.html 二，js代码： 1,app.vue <script> export default { onLaunch: function() { console.warn('当前组件仅支持 uni_m ......
uni-app:button中添加图片/图标时与文字对齐(hbuilderx 3.7.3)
一，js代码： 1,html： <!-- 语音音阶动画 end--> <button class="btn" @click="goRecord"> <uni-icons :type="micType" size="30"></uni-icons> {{title}} </button> <view ......
微信小程序uni-app开发中遇到的踩坑一二三事
兼容问题 开发者工具中正常显示，在手机上运行时却出现问题 举例： tab切换效果，默认第一个tab是激活状态，后面的是未激活状态，初始化是正常的（这里的激活状态与其他初始状态的区别在于字体颜色不一样，添加一个class控制样式） 问题：切换，当前点击激活的是正常的，其他的都无法显示，开发者工具上可正 ......