uni-app

居家隔离14-10 快解放啦 uni.setStorage(OBJECT) 将数据存储在本地缓存中指定的 key 中，会覆盖掉原来该 key 对应的内容，这是一个异步接口。 OBJECT 参数说明 参数名 类型 必填 说明 key String 是 本地缓存中的指定的 key data Any 是 需要存储的内容，只支持原生类型、及能够通过 JSON.stringify 序列化的对象 success Function 否 接口调用成功的回调函数 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） uni.getStorage(OBJECT) 从本地缓存中异步获取指定 key 对应的内容。 OBJECT 参数说明 参数名 类型 必填 说明 key String 是 本地缓存中的指定的 key success Function 是 接口调用的回调函数，res = {data: key对应的内容} fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数（调用成功、失败都会执行） 样例 <template> <view class="content"> <view><button type="primary" @click="fun

项目地址 githup : https://github.com/SilurianYang/uni-simple-router uni-simple-router 一个更为简洁的 Vue-router ，专为 uni-app 量身打造 简介说明: 是否你也曾感叹过为啥官方就不搞一个类似 Vue-router 一样的路由管理器？苦苦寻找。搜遍百度？社区？以及 Google？甚至是官方的各大 QQ 群？难受没找到！ 直到此插件出来之前也没有一个更好的解决方法 。于是 它 ，没错，就是 它 ，它诞生了。 只要你会使用 Vue-router 即可马上上手，下面文档的完全不用看。它保留了 Vue-router 完全相似的书写风格，让你 倍感亲切 ! 大纲 安装 组件式的导航 1.2.2+ 编程式的导航 命名式路由 路由传参 1.2.2+ 全局前置守卫 全局后置钩子 路由独享守卫 路由元信息 H5路由跳转进度条 1.2.2+ 完整的导航解析流程 首次触发生命钩子注意事项 1.2.2+ NAVTYPE取值类型 1.1.0+ 注意事项 安装 NPM 复制代码 npm install uni-simple-router 如果在一个模块化工程中使用它，必须要通过 Vue.use() 明确地安装路由功能： 复制代码 import Vue from 'vue' import Router from

onPullDownRefresh 监听该页面用户下拉刷新事件 需要在 pages.json 里 开启 enablePullDownRefresh "globalStyle": { } 当处理完数据刷新后，uni.stopPullDownRefresh 可以停止当前页面的下拉刷新 uni.startPullDownRefresh(OBJECT) success Function 否 接口调用成功的回调 fail Function 否 接口调用失败的回调函数 complete Function 否 接口调用结束的回调函数 uni.stopPullDownRefresh() 停止当前页面下拉刷新 page.json 开启下拉刷新 { "pages": [ { "path": "pages/index/index", "style": { "navigationBarTitleText": "hi uni", "enablePullDownRefresh": true } }, index.vue <view v-for="(item, index) in newsList" class="newslist">{{item}}</view> onPullDownRefresh:function(){ this.getList(); }, 导航 uni.navigateTo uni

事件修饰符 stop的使用会阻止冒泡，但是同时绑定了一个非冒泡的事件，会导致该元素上的catchEventName失效！ prevent可以直接干掉，因为uni-app里没有什么默认事件，比如submit并不会跳转页面。 self没有可以判断的标识 once也不能做，因为uni-app没有removeEventListener,虽然可以直接在handleProxy中处理，但非常的不优雅，违背了愿意，暂不考虑按键修饰符：uni-app运行在手机端，没有键盘事件，所以不支持按键修饰符。 view 视图容器 hover-class 类型为string，默认值none 指定按下去的样式类，类hover-class="none"时，没有点击态效果 hover-stop-propagation 类型boolean，默认值false 指定是否阻止本节点的祖先节点出现点击态 hover-start-time 类型number，默认值50 按住后多久出现点击态 hover-stay-time 类型number，默认值400 手指松开后点击态保留时间 <picker :range="years" @change="yearChange" mode="multiSelector"> <view> {{years[0] [yearIndex1]}} {{years[1][yearIndex2]}} <

打开App.vue 文件 // #ifdef APP-PLUS // 锁定屏幕方向 plus.screen.lockOrientation('portrait-primary'); // #endif 来源： oschina 链接： https://my.oschina.net/u/575762/blog/3162935

居家隔离14-1 继续年前的学习总结 class 支持的语法: <view : class = "{ active: isActive }" > 111 </view> <view class = "static" v-bind:class = "{ active: isActive, 'text-danger': hasError }" > 222</view <view class = "static" : class = "[activeClass, errorClass]" > 333 </view> <view class = "static" v-bind:class = "[isActive ? activeClass : '', errorClass]" > 444 </view> <view class = "static" v-bind:class = "[{ active: isActive }, errorClass]" > 555 </view> style 支持的语法: <view v-bind:style = "{ color: activeColor, fontSize: fontSize + 'px' }" > 666 </view> <view v-bind:style = "[{ color: activeColor, fontSize:

居家隔离14-2 页面跳转，两种模式 一种,类似a标签 <template> <view> <view class="page-body"> <view class="btn-area"> <navigator url="navigate/navigate?title=navigate" hover-class="navigator-hover"> <button type="default">跳转到新页面</button> </navigator> </view> </view> </view> </template> 二种，使用js，个人比较喜欢这样的，整齐好修改 <template> <view class="content"> 这里是菜单 <scroll-view class="menus"> <view v-for="(menu, index) in menus" :id="'view'+index" :key="index" :class="[index == currentIndex ? 'menuActive' : '']" @tap="seltag">{{menu.name}} </view> </scroll-view> </view> </template> <script> export default { data() { return { title:

居家隔离14-10 快解放啦 。。。 简单的input组件 <template name="first_input"> <view> <input type="text" :placeholder="placeholder" class="myinput" v-model="val" /> <button type="primary" @click="fun_submit">修改父页面数据</button> </view> </template> <script> export default { name: "myinput", data() { return { val: '' } }, //属性 props: { placeholder: { type: String, //属性类型 value: "请输入..." } }, //组件生命周期 created: function(e) { }, methods: { fun_submit: function() { console.log('输入数据=' + this.val); // 组件调用父组件的方法 myevent为对应自定义方法名 和vue里相关方法一样 this.$emit('myevent', this.val); }, } } </script> <style> .myinput { padding: 5px;

mpvue,wepy跟不上节奏就不谈了。比较下原生，taro, uni-app 原生：效率低下，语法支持性差 ,框架就是用来节省时间的， taro：基于raect，本人react没有深入 后续有机会再实践 uni-app： 效率高，应用市场也丰富。 vue上手难度低，对于企业来讲更容易进行维护 。 vue流行主要是因为它可以简化开发者的代码、无需开发者手动做很多优化，就可以得到高性能的应用。 不比一般人原生写的性能差， 比如原生微信开发setdata，从逻辑层js传输数据到视图层，是有时间损耗的。而uni-app是自动diff差量更新数据。 来源： oschina 链接： https://my.oschina.net/u/560237/blog/3168839

介绍openid 微信开发时, 用户使用小程序需要授权, 这时就要用到openid进行绑定这个用户。 openid是微信用户在公众号appid下的唯一用户标识（appid不同，则获取到的openid就不同），可用于永久标记一个用户，同时也是微信JSAPI支付的必传参数。 1. 为什么要使用openid呢？ openid是指这个用户在某一个小程序中授权后的唯一标识(比如你的身份证) 2. 如果不使用会带来什么问题呢？ 第一次授权时将用户数据保存到数据库, 然后用户把缓存清理了, 第二次授权的时候我们就无法知道这个用户是否授权过。用户就会重新保存一份新的数据进数据库。这是不符合正常逻辑的，因为如果该用户买过东西，再次授权，东西都看不到了，会像新的号一样。当然了， 有的设计是有自己的记录方式的，比如需要注册登录。 3. openid如何获取？ 需要用到wx指定的接口 注意： 注意：一般都是将code值传到后端去获取openid，因为在前端可能会被抓包或爬取到你的appid和secret，不安全，如果放在后端获取openid，除非你的服务器被攻击了，不然就是安全的。下面的实例是在前端直接获取的，这个明白后，可以直接改成后端的，是逻辑一样的。 步骤一：获取code值 通过uni.login()接口（同理wx.login）, 拿到用户的code值(5分钟后失效)。 代码： uni.login(