uniapp项目问题及解决(前后端互联)

1.路由跳转的问题

uni.navigateTo() 保留当前页面,跳转到应用内的某个页面,使用uni.navigateBack可以返回到原页面

uni.redirectTo()

关闭当前页面,跳转到应用内的某个页面。

uni.reLaunch()

关闭所有页面,打开到应用内的某个页面

uni.switchTab()

跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。

uni.navigateBack()

关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层。

2.tabBar的使用

tabBar": {"color": "#333333","selectedColor": "#1890FF","backgroundColor": "#ffffff","list": [{"pagePath": "pages/index/index", //页面路径"text": "首页", //按钮文字"iconPath": "static/首页01.png", //图片路径"selectedIconPath": "static/首页001.png" //选中的图片路径},{"pagePath": "pages/addwork/addwork","text": "添加","iconPath": "static/添加01.png","selectedIconPath": "static/添加001.png"},{"pagePath": "pages/user/user","text": "我的","iconPath": "static/我的01.png","selectedIconPath": "static/我的001.png"}]}

3.u-view组件的引入

刚开始时下载的2.0版本的u-view,看的1.8的文档,一直引入不对,只能通过important引入,在注册,之后才能使用,中间还发现有些组件不能用,后面发现了问题,换成2.0版本的文档,立马就能引入了,还是直接引入,不需要通过important引入,也不需要注册了,直接写标签就可以了

4.u-view组件的使用

使用过程中,有些属性方法,文档上没有,这个时候需要看他的github,直接看他的源码,就行了

5.组件的样式修改

1.在全局文件里面修改,这样会直接覆盖组件的样式

2.Vue 中,

::v-deep 用于深度作用选择器,可以让样式穿透到子组件中。

:global 则用于全局作用选择器,可以使样式不受组件的限制。

6.命名规范

一定要在刚开始的时候商量好,要不多人合作容易出现不同的风格

7.rpx和view的使用

都是为了自适应屏幕

8.前后端对接

一定要商量要不然会有进度差异,命名格式,字段名称啥的都说好,方便彼此,要不然后面修改不好修改

9需求文档

越早编写越好。这样对项目有一个明了的认识

10,axios的配置

import axios from 'axios';// create an axios instance
const http = axios.create({baseURL: '', // url = base url + request url// withCredentials: true, // send cookies when cross-domain requests 注意:withCredentials和后端配置的cross跨域不可同时使用timeout: 4000, // request timeoutcrossDomain: true,
});// request拦截器,在请求之前做一些处理
http.interceptors.request.use((config) => {// if (store.state.token) {//     // 给请求头添加user-token//     config.headers["user-token"] = store.state.token;// }console.log(config.data);console.log('请求拦截成功');config.data = JSON.stringify(config.data);return config;},// const token = uni.getStorageSync("linkToken");//     config.headers['Content-Type'] = 'application/json';//     if (token) {//         config.headers.Authorization = `Bearer ${token}`;//     }//     return config;// },(error) => {console.log(error); // for debugconsole.log('sssssssssssssss');return Promise.reject(error);}
);// 配置成功后的拦截器
http.interceptors.response.use((res) => {console.log(res);if (res.status === 200) {return res.data;} else {return Promise.reject(res.data.msg);}
}, (error) => {console.log(error);if (error.request.status) {switch (error.response.status) {case 401:break;default:break;}}return Promise.reject(error);
});// 在main.js中放入这段自定义适配器的代码,就可以实现uniapp的app和小程序开发中能使用axios进行跨域网络请求,并支持携带cookie
axios.defaults.adapter = function (config) {return new Promise((resolve, reject) => {console.log(config);const settle = require('axios/lib/core/settle');const buildURL = require('axios/lib/helpers/buildURL');uni.request({method: config.method.toUpperCase(),url: config.baseURL + buildURL(config.url, config.params, config.paramsSerializer),header: config.headers,data: config.data,dataType: config.dataType,responseType: config.responseType,sslVerify: config.sslVerify,complete: function complete(response) {console.log('执行完成:', response);response = {data: response.data,status: response.statusCode,errMsg: response.errMsg,header: response.header,config,};settle(resolve, reject, response);},});});
};export default http;

11.axios配置过程中的问题

包的丢失,因为创建文件夹的时候是先创了一个文件夹,又创了项目,所以导致项目的的名称和文件的名称一摸一样,有的包配置的时候不知道怎么回事跑到了项目外面,导致的一直配置不出来,后面来回来就行了

12.样式不用写的那么急,先把模块设计好,后面的时候,再调就好了,写样式的时候可以参照网上的项目,要不自己凭感觉写的,不太好看

13.后端接口,先测试

这次写的时候,调用总宁的接口,能调用上去,但是这边一直一直传数据传不过去,最后问了学长,是自己配代理服务器的时候用的两个的端口都用的同一个,导致出的问题,

和后端连接我这边出了不少问题,一直有问题,一直改,还是太菜了

14.表单的检验

写表单的时候光注意样式了,复制的人家的源码,觉得上面的东西太多了,我就都删了,最后效果也能实现,但是没有检验了,后面能调用接口了,发现越来越别扭,因为没有校验,所以写啥都能过,果然不能省事,所以后面我还得再补,有点难受了,后面还得写reuls,还由页面结构也得在补包裹的对象

15.token的传递

在axios的配置里面可以直接传递

16.全局设置请求

target里面的http需要写不写的话,会报500错误

17,页面传参

通过url传参

url: /pages/workdetail/workdetail?id=${this.id}

18页面传参的时候出现问题

注意看apifoxs可能是后端的问题,也可能是前端的问题

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/799439.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL-复杂SQL语句编写:子查询分析与练习

子查询 1. 由一个具体的需求&#xff0c;引入子查询2. 称谓的规范&#xff1a;外查询&#xff08;或主查询&#xff09;、内查询&#xff08;或子查询&#xff09;3. 子查询的分类4. 单行子查询4.1 单行操作符&#xff1a; ! > > < <4.2 子查询中的空值问题4.3 非…

揭开Spring Bean生命周期的神秘面纱

目录 一、Spring IOC 1.1 Spring IOC 的加载过程 二、Spring Bean 生命周期 2.1 实例化前置 2.2 实例化后置 2.3 属性赋值 2.4 初始化前置 2.5 初始化 2.6 初始化后置 2.7 Bean 销毁 Spring 是一个开源的企业级Java应用程序框架&#xff0c;它简化了企业级应用程序开…

开源数据湖iceberg, hudi ,delta lake, paimon对比分析

Iceberg, Hudi, Delta Lake和Paimon都是用于大数据湖(Data Lake)或数据仓库(Data Warehouse)中数据管理和处理的工具或框架,但它们在设计、功能和适用场景上有所不同。 Iceberg: Iceberg是用于大型分析表的高性能格式。Iceberg将SQL表的可靠性和简易性带入到大数据领域,同…

【java的本地锁到分布式锁介绍】

文章目录 1.java本地自带锁介绍及应用synchronized&#xff08;1&#xff09;synchronized原理和优化&#xff08;2&#xff09;synchronized作用&#xff08;3&#xff09;synchronized的使用 CAS(1) CAS原理&#xff08;2&#xff09;CAS和synchronized优缺点 lock 2.分布式锁…

idea常用配置

IDEA设置全局配置 参考&#xff1a;IDEA设置全局配置_idea如何打开一个项目,全局设置-CSDN博客 idea提交代码到git或svn上时&#xff0c;怎么忽略.class、.iml文件和文件夹等不必要的文件 参考&#xff1a;idea提交代码到git或svn上时&#xff0c;怎么忽略.class、.iml文件和文…

LeetCode-74. 搜索二维矩阵【数组 二分查找 矩阵】

LeetCode-74. 搜索二维矩阵【数组 二分查找 矩阵】 题目描述&#xff1a;解题思路一&#xff1a;先二分查找行&#xff0c;再二分查找列。解题思路二&#xff1a;暴力遍历&#xff0c;也能过。解题思路三&#xff1a;用python的in。 题目描述&#xff1a; 给你一个满足下述两条…

VSCODE目录树缩进调整

VSCode默认的缩进太小了&#xff0c;简直看不出来&#xff0c;很容易弄混目录。在设置里修改就行了。 修改后效果&#xff1a;

何为网络协议?一图知晓网络过程。

网络协议就是计算机之间沟通的语言 为了有效地交流&#xff0c;计算机之间需要一种共同的规则或协议&#xff0c; 就像我们和老外沟通之前&#xff0c;要先商量好用哪种语言&#xff0c; 要么大家都说中文&#xff0c;要么大家都说英语&#xff0c;这才能有效地沟通。 网络协…

04-springmvc-RequestContextHolder

一、获取request对象的四种方法 方法1、Controller中加参数来获取request 注意&#xff1a;只能在Controller中加入request参数。 一般&#xff0c;我们在Controller中加参数获取HttpServletRequest&#xff0c;如下所示&#xff1a; RestController RequestMapping("…

OSPF中配置静态路由负载分担实验简述

OSPF中配置静态路由负载分担 实验简述 在静态路由负载分担中&#xff0c;多个路由器被配置为共享负载的目标&#xff0c;以实现流量的均衡分配。 到达目的地有N条相同度量值的路径&#xff0c;默认值60&#xff0c;N条路由是等价路由&#xff0c;数据报文在N条链路上轮流发送。…

速盾:cdn原服务器地理位置

CDN&#xff08;Content Delivery Network&#xff09;是一种通过在不同地理位置部署服务器的技术&#xff0c;旨在提高网站的访问速度和稳定性。它将原始服务器内容复制到多个节点服务器中&#xff0c;这些节点服务器分布在全球各个地理位置&#xff0c;并根据用户的地理位置和…

使用iPhone/安卓手机代替门禁卡

文章目录 基础知识ID卡和IC卡ID卡技术IC卡技术IC卡加密方式手机NFC只能模拟IC卡&#xff0c;而不支持ID卡电梯卡可能使用滚动码验证方式&#xff0c;不支持使用手机模拟 &#xff08;IC类型&#xff09;门禁卡验证方式仅验证ID&#xff08;卡号&#xff09;验证ID分区信息 iPho…

【云开发笔记NO.28】数据中台的概述

数据中台的定义 在云开发中&#xff0c;数据中台是一个综合性的数据管理和服务平台&#xff0c;它集成了数据管理、数据治理、数据服务等多个功能&#xff0c;并基于云计算技术架构而建立。数据中台的核心目标是为企业提供稳定、高效、安全的数据支持和服务&#xff0c;进而推…

探索基于WebRTC的有感录屏技术开发流程

title: 探索基于WebRTC的有感录屏技术开发流程 date: 2024/4/7 18:21:56 updated: 2024/4/7 18:21:56 tags: WebRTC录屏技术屏幕捕获有感录屏MediaStream实时传输音频录制 第一章&#xff1a;技术原理 WebRTC&#xff08;Web Real-Time Communication&#xff09;是一种开放源…

Python中的 if __name__ == ‘__main__‘

一、if name ‘main’ 在Python的世界里&#xff0c;if name ‘main’:这行代码就像是派对的入口&#xff0c;它决定了哪些部分是只在当前这个“派对”&#xff08;或者说脚本&#xff09;中直接执行的&#xff0c;哪些部分是可以被其他“派对”&#xff08;或脚本&#xff…

【Vue】 Vue项目中的跨域配置指南

她坐红帐 面带浓妆 唢呐一声唱 明月光 这女子泪眼拜高堂 一拜天地日月 二拜就遗忘这一生 跪三拜红尘凉 庭院 大门锁上 杂乱的眼光 多喧嚷 这女子笑颜几惆怅 余生喜乐悲欢都无关 她眼中已无光 &#x1f3b5; 倪莫问《三拜红尘凉》 在前后端分离的项目开发中…

Java中的内存模型和例子

Java内存模型&#xff08;Java Memory Model, JMM&#xff09;是Java虚拟机&#xff08;JVM&#xff09;规范中定义的一种关于内存访问、共享变量在多线程之间的可见性、以及原子性、顺序性的规则。Java内存模型的目标是定义程序中各个共享变量的访问方式&#xff0c;以及如何在…

python实例1.2:创建一个简易的命令行地址簿程序,允许用户添加、删除、查找和编辑联系人(详解及其知识点拓展)

目录 一、基础&#xff1a;地址簿程序代码附带注释 二、基础&#xff1a;地址簿程序详细分析 三、拓展&#xff1a;地址簿程序拓展&#xff0c;如何实现在地址簿程序中持久化数据&#xff1f; 四、拓展&#xff1a;地址簿程序拓展代码详细分析 一、基础&#xff1a;地址簿程…

SQL Sever 2008 安装教程

先从官网下载程序&#xff1a;下载地址 打开上述链接后&#xff0c;点击下载按钮。 就会跳出下面这个界面&#xff0c;如果你的电脑是64位的请选择下图中这两个程序。 下载完成后&#xff0c;在电脑磁盘中找到这两个文件&#xff0c;注意安装的顺序&#xff0c;先安装 SQLEXPR…

Linux:软硬链接及动静态库

一、Linux中的链接文件 1.1硬链接及应用场景 ln//创建硬链接 我们再创建一个硬链接生成的文件。 我们可以看到mlink.hard的inode和makefile.c的inode都是一样的&#xff0c;inode一样里面的数据自然也是一样。相当于对make.file进行了一个重命名&#xff0c;所以硬链接一定没…