uni-app取消原生头部导航栏
1.取消uni-app原生头部导航栏(全局取消)
所有页面都去掉:在pages.json里配置navigationStyle:custom =>网址 https://uniapp.dcloud.io/collocation/pages?id=globalstyle
2.单页面取消
新版小程序支持page->style配置navigationStyle为custom = ...
uni-app,v-for时 block 和 view 的使用
uni-app,v-for时 block 和 view 的使用
1 <template>
2 <view>
3 <view v-for="stuObj in studentArry">
4 <view>姓名: {{ stuObj.name}} , 年龄: {{ stuObj.age}}</view>
5 <view>
6 擅长技能:
7 <!-- 双层循环 sk in stuObj.skill 就像 ...
uni-app 之验证码
手机APP---验证码
最近公司在开发手机APP,app避不可免的就是登录了,emmmm 登录验证码那必须的是有的,我们公司发给我们的图片是酱紫的~~
这个要求大家应该都能看懂,做这个手机号啊,验证码啊,读秒这些啊,这都emmmm分分钟完成了?但是这个四位数的验证码整整折磨了我四天,啊!!!! 恶龙咆哮~
其实这个实现 ...
uni-app中的数值监控方式及函数的封装和引用方式
1.在商品订单计算商品价格的时候老觉得押金加不上去。后来用了number强转,将类型强转为数值类型才解决问题
data() {
return{
// 支付数值统计
statistic:[],
coupon_money:0,//可抵扣优惠价
real_total:0,//商品实付金额
}
//计 ...
uni-app与HTML的区别 【转】
组件/标签的变化
以前是html标签,现在是小程序标签
div 改成 view
span、font 改成 text
a 改成 navigator
img 改成 image
input 还在,但type属性改成了confirmtype
form、button、checkbox、radio、label、textarea、canvas、video 这些还在。
select 改成 picker
iframe 改成 web-view
ul、li没有了,都用view替代
a ...
uni-app学习(四)好用的插件2
1. uni-app学习(四)好用的插件2
1.1. 树形结构
点击这里
1.2. 下拉刷新上拉加载组件
如果想把下拉上拉做成自定义的,更加好看,可以使用这个插件
地址这里
举个例子
1.3. 浮动键盘
自定义的键盘,用来限制输入不错
类型有:keyboard 普通键盘 car 汽车键盘 number 数字键盘
特别注意:如果只是需要数字键盘,不一 ...
uni-app学习(三)好用的插件1
1. uni-app学习(三)
1.1. async/await使用
表示异步处理,可使用then函数继续操作,返回的是Promise
async function timeout() {
return 'hello world'
}
timeout().then(result => {
console.log(result);
})
console.log('虽然在后面,但是我先执行');
先打印下面这句
await是等待的意思,它后面可以放任何 ...
uni-app事件
在html中,经常有操作到标签的事件,
比如按钮的点击事件,文本框的获得焦点事件
在uni-app中也会操作事件,不过更加方便
这个事件和html中的基本相同,也有部分差异,以下为uni-app官网的差异描述
知道了具体事件名称后,我们就可以开始操作
<template>
<view class="content">
<input type="text" @click=" ...
uni-app数据绑定
之前接触前端,数据绑定这块要么用组件,要么用jq去操作dom
uni-app数据绑定分两种情况
在标签内部绑定使用:{{参数}}
标签内部绑定使用: 例::value='参数' 也就是标签内属性绑定参数要多加个:
当前绑定的前提基于该参数存在
在每个.vue的页面中都有配置数据的地方:
<script>
export default {
data() {
...
uni-app学习(二)
1. uni-app学习(二)
1.1. 好用css记录
一定透明度的背景色background: rgba(255,255,255,.6);
1.2. 好用的代码段
store(用户登录)
export default {
state: {
hasLogin: false, //登陆状态
loginProvider: "", //登陆方式 如 微信
openid: null, //应用id
address: {}, //收货地址
userinfo: {
nickN ...
uni-app学习
1. 学习uni-app
1.1. 概述
号称一次编写多端运行的前端框架,架构图如下
对某些不同平台的特殊功能,可以通过条件进行自动编译,也就是写两套代码,不同的环境会选择不同代码编译
1.2. 推荐工具
其本身推荐的开发工具是HBuilderX,官方IDE下载地址
1.3. 开始趟坑
1.3.1. 新建页面
由于一开始我建错目录,删掉重新建 ...
小程序开发:用原生还是选框架(wepy/mpvue/uni-app/taro)?
小程序开发:用原生还是选框架(wepy/mpvue/uni-app/taro)?
自 2017-1-9微信小程序诞生以来,历经2年多的迭代升级,已有数百万小程序上线,成为继Web、iOS、Android之后,第四大主流开发技术。
与之相随,小程序的开发生态也在蓬勃发展,从最初的微信原生开发,到wepy、mpvue、taro、uni-app等框架依次出现,从刀耕火种演 ...
uni-app快速入门(转)
uni-app支持通过 HBuilderX可视化界面、vue-cli命令行两种方式快速创建项目。
通过 HBuilderX 可视化界面
可视化的方式比较简单,HBuilderX内置相关环境,开箱即用,无需配置nodejs。
开始之前,开发者需先下载安装如下工具:
HBuilderX:官方IDE下载地址
HBuilderX是通用的前端开发工具,但为uni-app做了特别强化。 ...
uni-app—从安装到卸载(转)
uni-app—从安装到卸载
uni-app实现了一套代码,同时运行到多个平台。支持iOS模拟器、Android模拟器、H5、微信开发者工具、支付宝小程序Studio、百度开发者工具、字节跳动开发者工具
工具安装
开发uni-app需要安装HBuilder X.下载地址。
下载成功后直接解压即可
简单的配置一 ...
uni-app引入阿里iconfont
前言:
目前正在通过 UNI-APP平台开发移动应用,uni-app平台是去年年出才创建的一个新品台,因此资源相对比较匮乏,在此遇到一个问题,一直使用别人提供的iconfont,但总是不够用,为了解决这个问题,花了些时间给自己也搞了个字体库,如何操作,请看下文。
准备:
阿里巴巴提供资源 ...
uni-app 环境配置,uni.request封装,接口配置,全局配置,接口调用的封装
1.环境配置 (可参考uni-官网的环境配置)
common文件夹下新建config.js
let url_config = ""
if(process.env.NODE_ENV === 'development'){
// 开发环境
url_config = 'https://*****.com/'
}else{
// 生产环境
url_config = 'https://*****.com/'
}
export default url_config
2.uni.request封 ...
uni-app多种设置全局变量及全局变量重新赋值
一、引用公共common.js(1、可在页面中直接引入common.js 2、在main.js中引用并挂载(这里是第二种))
export default {
memberObj:{
name:'初始姓名',
},
setMemberObj(data){
this.memberObj = Object.assign({},this.memberObj,data)
}
}
(1)、在全局main.js中引用
import Vue from ...
Uni-app页面路由区分注意事项
总结Tips:
(1)navigateTo,redirectTo 只能打开非 tabBar页面
(2)switchTab只能打开 TabBar 页面
(3)reLaunch可以打开任意界面
(4)页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有tabBar
(5)不能在 App.vue 里面进行页面跳转
uni.navigateTo( OBJECT) — ...
uni-app 页面 路由navigate
uni-app 页面 路由navigate
uni-app 是一个使用 Vue.js 开发跨平台应用的前端框架,开发者编写一套代码,可编译到iOS、Android、H5、小程序等多个平台。
公司最近在写APP应用到了uni-app 我在写的时候发现了一些路由跳转的问题 。 先说一下关于路由的各个接口把,各参数参数说明详见官网https:// ...
uni-app 安卓离线打包详细教程
借鉴 uni-app官方给出的文章http://ask.dcloud.net.cn/article/508(虽说是04年的)
预备环境
AndroidStudio开发环境,要求安装Android4.0或以上(API 14)SDK。
下载HBuilder离线打包Android版SDK(5+ SDK下载)。
离线打包SDK目录说明
HBuilder-Hello:离线打包演示应用;
HBuilder-Integrate: 5+ SDK 集成和插件 ...