控件: 1、navigator页面跳转 //关闭当前页面,返回上一页面或多级页面 <navigator open-type="navigateBack"> </navigator>
2、将 data 存储在本地缓存中指定的 key 中,从本地缓存中异步获取指定 key 对应的内容 //data存储本地缓存key uni.setStorageSync(KEY,DATA) 例: uni.setStorageSync('storage_key', 'hello'); //从本地缓存中异步获取指定 key 对应的内容 uni.getStorage(OBJECT) 例: uni.getStorage({ key: 'storage_key', success: function (res) { console.log(res.data); } });
3、跳转请求和消息框 //关闭所有页面,打开到应用内的某个页面 uni.reLaunch({ url: '/pages/catalog/catalog' }); //发起网络请求 uni.request({ url: 'https://www.example.com/request', data: { text: 'uni.request' //自定义请求头信息 }, header: { 'custom-header': 'hello' }, success: (res) => { console.log(res.data); this.text = 'request success'; } }); //显示消息提示框 uni.showToast({ position: 'bottom', title: "登录失败", icon: 'none', })
4、uniapp中@tap和@click的区别 //在HbuilderX中,两者都是点击时触发事件;不同的是: @click是组件被点击时触发,会有约300ms的延迟(内置处理优化了); @tap是手指触摸离开时触发,没有300ms的延迟,但是会有事件穿透; 编译到小程序端,@click会被转换成@tap;
5、自动更新思路 //调用本地应用资源版本号 plus.runtime.getProperty(plus.runtime.appid,function(inf){ Console.log(“当前应用版本 :”+inf.version+”--”+plus.runtime.version ); }); //调用第三方程序打开指定的 URL(做自动更新用) plus.runtime.openURL(url); //总结 1、自动更新,获取json文件版号信息 。 2、获取app版本号plus.runtime.getProperty。 3、如果json版本号大于app版本号。 4、plus.runtime.openURL调用浏览器打开指定app安装包。
5、跳转 uni.navigateTo 保留当前页面,跳转到应用内的某个页面,使用uni.navigateBack可以返回到原页面。 //在起始页面跳转到test.vue页面并传递参数 uni.navigateTo({ url: 'test?id=1&name=uniapp' }); //在test.vue页面接收参数 export default { onl oad: function (option) { //option为object类型,会序列化上个页面传递的参数 console.log(option.id); //打印出上个页面传递的参数。 console.log(option.name); //打印出上个页面传递的参数。 } } //uni.navigateTo()和uni.reLaunch()跳转区别 uni.navigateTo()跳转后有返回键。 uni.reLaunch()跳转后关闭上一级页面,没有返回键。
6、uniapp中使用openlayers <template> <view class="containerMap"> <view id="olMap" class="olMap"> </view> </view> </view> </template> <script module="ol" lang="renderjs"> export default { data() { return { map: null, } }, if (typeof window.ol === 'function') { this.initAmap() } else { const link = document.createElement('link') link.rel = "stylesheet" link.href = 'static/plugins/ol/ol.css' //可以通过此方式导入jquery,echart库 document.head.appendChild(link) const script = document.createElement('script') script.src = 'static/plugins/ol/ol.js' //可以通过此方式导入jquery,echart库 script.onload = this.initAmap.bind(this) document.head.appendChild(script) } methods: {
this.map = new ol.Map({
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
target: "olMap",
view: new ol.View({
zoom: 18,
center: [114, 25],
projection: "EPSG:4326"
})
})
}
<script>