![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
uni-app
Trist丨
www.trist.cn
展开
-
uni-app中微信小程序端使用腾讯地图API实现定位服务(超详细教程)
在目前的小程序开发中,为了更好的用户体验,以及信息推荐,我们难免要获取用户的授权拿到定位。所以在uni-app的学习中,我决定将实现的步骤详细地记录下来,希望可以帮助到更多的人!使用到的方法及api:实现这个功能时,最好先看一遍官方的文档uni.authorize(OBJECT) 向用户发起授权请求 点击查看uni-app官方文档qqmapsdk = new QQMapWX({ }...原创 2020-04-18 22:53:22 · 15028 阅读 · 3 评论 -
快速入门vuex带案例说明(超详细易理解)
理论关于VueXVueX是适用于在Vue项目开发时使用的状态管理工具。试想一下,如果在一个项目开发中频繁的使用组件传参的方式来同步data中的值,一旦项目变得很庞大,管理和维护这些值将是相当棘手的工作。为此,Vue为这些被多个组件频繁使用的值提供了一个统一管理的工具——VueX。在具有VueX的Vue项目中,我们只需要把这些值定义在VueX中,即可在整个Vue项目的组件中使用。VueX中的核...原创 2020-04-16 23:22:44 · 554 阅读 · 1 评论 -
uni-app中的分类页面(仿京东分类页面)(scroll-view的使用)
京东效果图:代码效果图:说明:实现图中所示的的左侧标签栏可上下滑动,右侧区域为对应左侧标签展开的图片文字详情说明,也具备上下滑动的功能scroll-view可滚动试图区域本文着重使用”scroll-y“即纵向滑动<template> <view class="classify"> <!-- 左侧标签区域 --> <scroll-...原创 2020-04-15 18:49:04 · 5454 阅读 · 0 评论 -
uni-app在小程序,h5端,安卓端的打包发布
在小程序端的打包发布1. 登录微信公众平台,如图所示,打开开发》开发设置》AppID(复制)2. 将复制的AppID粘贴到配置文件manifest.json中3. 如若需要发布,则需要修改api的接口修改为线上的接口域名,并在微信开发设置的服务器域名中配置(socket合法域名)4. 修改完成后重新编译,在微信开发者工具点击上传*我们会遇到如下提示,需要把字体图标文件转至线上...原创 2020-04-02 11:46:16 · 1230 阅读 · 0 评论 -
uni-app开发微信小程序封装异步请求
在uni-app项目中如需经常发起网络请求,可以为uni.request方法进行二次封装,使代码更加简洁,便于后期修改维护原无封装代码:onLoad() { // 在页面加载时调用 this.getSwipers() }, methods: { getSwipers () { // 发送请求 uni.request({ url: 'http://...原创 2020-03-30 15:53:46 · 1411 阅读 · 0 评论 -
vue,uni-app组件间的通讯(父子,兄弟组件间传值)
父组件给子组件传值父组件通过v-bind绑定数据传递给子组件:<template> <view> <son :msg="msg"></son> </view></template><script> import son from "@/components/son/son.vue" expor...原创 2020-03-30 11:19:44 · 2086 阅读 · 8 评论 -
搭建本地api接口
搭建本地api接口1. 使用phpstudy开启MySQL服务2. 创建数据库设置与sql文件相同的数据库名称运行sql文件(注意选择字符集)3. 运行服务器安装包:cnpm i运行:node ./文件名检查接口是否开启在cmd窗口关口开启的端口号,在浏览器中访问,出现数据即为成功搭建本地api接口...原创 2020-03-27 20:14:01 · 6994 阅读 · 5 评论 -
uni-app中下拉刷新及上拉刷新的使用
下拉刷新开启下拉刷新的两种方式:在pages.json中,找到当前页面的pages节点,并在style中添加 enablePullDownRefresh "style":{ "enablePullDownRefresh": true }通过设置点击事件触发 uni.startPullDownRefresh() 方法监听下拉刷新:onPullDownRefres...原创 2020-03-27 19:00:34 · 1768 阅读 · 1 评论 -
了解uni-app的生命周期(应用,页面生命周期)执行顺序
应用生命周期定义在app.vue中生命周期函数名说明onLaunch当uni-app 初始化完成时触发(全局只触发一次)onShow当 uni-app 启动,或从后台进入前台显示(多次触发)onHide当 uni-app 从前台进入后台(多次触发)onUniNViewMessage对 nvue 页面发送的数据进行监听,可参考 nvue 向 vue ...原创 2020-03-27 18:09:41 · 13380 阅读 · 3 评论 -
uni-app中理解,区分,使用rpx单位和px单位及样式字体的导入
uni-app中的rpxTips:rpx 即响应式 px,是一种根据屏幕宽度自适应的动态单位。rpx 以 750 宽的屏幕为基准,750rpx 恰好为屏幕宽度 (即 375rpx) 为屏幕一半的宽度);当屏幕变宽时,rpx 实际显示效果也会等比例放大使用 @import 语句导入外联样式表@import url("./test.css");支持基本的常用选择器 class,id,el...原创 2020-03-27 11:32:13 · 11737 阅读 · 1 评论 -
入门,创建uni-app项目
开始使用uni-app目录结构一个uni-app工程,默认包含如下目录及文件:┌─components uni-app组件目录│ └─comp-a.vue 可复用的a组件├─hybrid 存放本地网页的目录├─platforms 存放各平台专用页面的目录├─pages ...原创 2020-03-25 16:00:10 · 168 阅读 · 0 评论