- 博客(78)
- 收藏
- 关注
RSS订阅原创 vue中请求库Axios使用方法
1.先Axios安装依赖 cnpm install axios2.在main.js中引入axios文件 import Axios from 'axios'3.在main.js中给Vue原型链挂载这个属性。 Vue.prototype.$axios = Axios;4.在其他组件中就可以引用axios。如下： created(){ this.$axios.get('所请求的文件地址').then( res => { console.log(res.data); })
2022-04-16 23:26:38
2361
原创 git 基本使用方法
1. 创建版本库 在项目文件夹内, 执行：git init // 会在项目文件中生成 .git 文件夹2. 提交文件 2.1 新建文件后, 通过 git status 进行查看文件状态 2.2 将文件添加到暂存区 git add 文件名 // git add . 表示提交所有文件 2.3 提交文件到本地库 git commit -m "注释内容", 直接带注释提交3. 查看文件提交记录 3.1 执行 git log 文件名, 进行查看历史记录 // 不加文件名, 表示查看所有的提交信息 3.
2022-04-16 23:20:16
434
原创 HTTP 基础知识
// HTTP (Hyper Text Transfer Protocol) 超文本传输协议// 1. 用于从万维网服务器传输超文本到本地浏览器的传输协议// 2. HTTP 协议是基于 TCP 的应用层协议, 它不关心数据传输的细节, 主要是用来规定客户端和服务器的数据传输格式, 最初是用来向客户端传输 HTML 页面的内容. 默认端口是80.// 3. HTTP 是基于请求与响应模式的、无状态的、应用层的协议。HTTP 请求报文主要由请求行、请求头部、空一行、请求正文4部分组成。// 请求方
2022-04-13 22:18:36
129
原创 ajax使用
// ajax (Asyncchhronous Javascript And XML) 异步的 javascript 和 XML 1. 异步和同步：客户端和服务器端相互通信的基础上 客户端必须等待服务器端的响应, 在等待的期间客户端不能做其他操作 --- 同步 客户端不需要等待服务器端的响应, 在服务器处理请求的过程中, 客户端可以进行其他操作 --- 异步 /* ajax 是一种在无需重新加载整个页面的情况下, 能够更新部分网页的技术, 通过在后台与服务器进行少量数据 * 交换, aj
2022-04-10 15:53:45
88
原创 vue2.0 路由router
// 1. 安装 npm install --save vue-router// 2. 新建 router 文件, 并在 index.js 中导入 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) export default new Router({ mode: 'history', // 访问路径不带#号 (有两种模式 hash模式 与 history模式) base: '/page/aa'
2022-04-09 20:42:54
1382
原创 数据库基础（mysql）(1)
1. MySQL 服务的启动和停止 方式一：点击计算机图标 -> 右键管理 -> 服务 -> MySQL右键启动 方法二：通过管理员身份打开 cmd 命令行窗口 启动mysql数据库: net start 服务名 (服务名可以通过方式一查看) 停止mysql数据库: net stop 服务名2. MySQL 服务的登录和退出 方式一： 通过 mysql 自带的客户端（MySQL 5.5 Command Line Client）, 只限于 root 用户 方式二： 通过
2021-11-06 19:49:38
419
原创 video组件上添加图标（uni-app）
// backPlayVideo.vue<template> <view> <video id="myVideo" class="videoWrap" autoplay="true" controls="false" src="/static/video.mp4"> <cover-image class="fullscreen" v-if="!isFullScreenStatus" src="../../static/fu
2021-11-02 23:42:11
1737
原创 前端(面向对象、继承)
// 1.面向对象的程序设计 (1) 类 (2) 对象实例 (3) 获取原型 类 prototype// 2. 继承 (1) ES6 的继承, 通过 extends (2) 基于原型的继承, 通过构造函数的 prototype 属性来实现// 3. 原型链 (object)// 4. this 的指向 1. 方法中的 this, 指向调用方法的对象 2. 全局环境下指向全局对象(window) 3. 全局函数中的 this, 指向全局对象 4. 内部函数中的 this, 指向全局对
2021-10-02 11:15:49
168
原创 解决async/await中的promise返回错误reject的问题
问题： await Promise, 只能接收到成功的 resolve() 的结果, 对于 reject() 的结果会报错。解决办法： try-catch来处理同步逻辑 eg: function test () { return new Promise((resolve, reject) => { this.$axios("请求地址").then((res) => { if (res.data.status === 200) { resolve(res.d
2021-09-28 22:41:47
4569
原创 wifi(uniapp)
<template> <view> home---{{title}} </view></template><script> const FvvUniWifiHelper = uni.requireNativePlugin("Fvv-UniWifiHelper"); export default { data() { return { title: "" } }, onLoad() { cons
2021-09-27 23:49:48
905
2
原创 wifi(uni-app)
<template> <view> home---{{title}} <button type="default" @click="getWifiInfo">获取wifi信息</button> </view></template><script> // const gbWiFi = uni.requireNativePlugin('Googbuild-WIFI'); const FvvUniWifiHe
2021-09-25 11:07:25
1330
原创 解决 iPhone 真机上无法重新授权的问题（uni-app）
// 问题说明：在 iPhone 设备上, 当用户取消授权之后, 再次点击选择收货地址按钮的时候, 无法弹出授权的提示框1. 导致问题的原因 - 用户取消授权后, 再次点击 "选择收货地址" 按钮的时候 （1）在模拟器上和安卓真机上, 错误消息 err.errMsg 的值为 chooseAddress:fail anth deny （2）在iPhone 真机上, 错误消息 err.errMsg 的值为 chooseAddress: fail anthorize no response2. 解决问题的
2021-09-20 21:17:23
1132
原创 负载均衡的策略（nginx）
// 1. RR(round robin: 轮询 默认的) 每个请求按时间顺序逐一分配到不同的后端服务器, 也就是说第一次请求分配到第一台服务器上, 第二次请求分配到第二台服务器上, 如果只有两台服务器, 第三次请求继续分配到第一台上, 这样循环轮询下去, 也就是服务器接收请求的比例是1:1, 如果后端服务器 down 掉, 能自动剔除。轮询是默认配置, 不需要太多的配置同一个项目分别使用 8081 和 8082 端口启动项目. upstream web_servers { server loc
2021-09-15 22:54:53
133
原创 日期选择器picker(uni-app)
<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="getDateChange"> <view class="timerText">{{date}}</view></picker>data() { return { date: "" }},computed: { startDate () { return this.getDate("
2021-09-08 17:25:49
1737
原创 前端（解决图片底部空白间隙的问题）
// 方法一 // 为 img 标签添加行内的 style 样式, 从而解决图片底部空白间隙的问题 （把图片变为块级元素） <img style="display: block;"/>// 方法二 // 给父元素添加 font-size: 0, 子元素字体大小重新设置// 方法三 // 设置 img 的属性 vertical-align: top/middle/bottom <img style="vertical-align: top"/>// 方法四 //
2021-09-07 23:33:48
1036
原创 上拉加载更多和下拉刷新（uni-app）
// 上拉加载更多数据// 1. 打开项目根目录中的 pages.json 配置文件, 为需要上拉加载更多页面配置上拉触底距离, 如下: "pages": [{ "path": "pages/index/index", "style": { "onReachBottomDistance": 150 //滚动页面到距离底部150px时，就会触发onReachBottom事件 } }]// 2. 在上面的页面中, 和 methods 节点平级, 声明 onReachBottom 事件
2021-09-07 23:22:22
576
原创 CSS样式
// 文字超出范围--省略号div { white-space: nowarp; // 文字不允许换行(单行文本) overflow: hidden; // 溢出部分隐藏 text-overflow: ellipsis; // 文本溢出后, 使用 ... 代替}
2021-09-06 23:14:34
90
原创 小程序分包(subPackages)
// 小程序分包：分包可以减少小程序首次启动时的加载时间// 在项目中，可以把 tabBar相关的 4 个页面放在主包中, 其他页面(如：商品详情、商品列表页) 放到分包中。// 在uni-app项目中, 配置分包的步骤如下：// 1. 在项目更目录下, 创建分包的根目录, 命名为 subpkg// 2. 在 pages.json 中, 和 pages 节点平级的位置声明 subPackages 节点, 用来定义分包相关的结构： { "pages":[{ "path": "pages/h
2021-09-06 23:03:02
4075
原创 git基本操作(创建分支、合并分支等)
// 小程序开发笔记// 1.创建 tabBar 分支 (基于 master 主分支在本地创建 tabBar 子分支, 用来开发和tabBar 相关的功能) git checkout -b tabbar// 2. 在本地编写代码// 3. 分支的提交与合并 // 3.1 将本地的 tabBar 分支进行本地的 commit 提交 git add . // (点前面有一个空格) git commit -m "注释" // 3.2 将本地的 tabBar 分支推送到远程仓库进行保存
2021-09-05 23:46:52
275
原创 小程序项目中请求函数（@escook/request-miniprogram）
/*小程序项目中, 不支持 axios, 而且原生的 wx.request() API功能较为简单, 不支持拦截器等全局定制的功能. 因此, 建议在 uni-app 项目中使用 @escook/request-miniprogram 第三方包发起网络数据请求。*/ [官方文档](https://www.npmjs.com/package/@escook/request-miniprogram) // 1. 初始化项目 npm init -y // 2. 安装 @escook/request-m
2021-09-05 23:46:02
2413
3
原创 请求拦截器和响应器（axios）
// axios 提供了拦截器, 用于我们在发送请求或者得到响应后, 进行对应的处理// 配置请求拦截 instance.interceptors.request.use(config => { // 请求拦截器的作用 // 1. 比如 config 中的一些信息不符合服务器的要求 // 2. 比如每次发送网络请求时, 都希望在界面中显示一个请求的图标 // 3. 某些网络请求(比如登录token), 必须携带一些特殊的信息 console.log(config) retu
2021-09-05 16:29:07
853
原创 请求函数（axios）
// 第一种方式// 1.安装 axios 依赖 # npm install axios// 2. 在项目根目录下，创建request文件夹，并创建 request.js 文件，内容如下： import axios from "axios" export function request (config, success, failure) { // 创建 axios 的实例 const instance = axios.create({ baseURL: "请求地址"， ti
2021-09-05 11:16:27
476
原创 请求函数封装(JSONP)
// JSONP 封装let count = 1export default function originPJSONP (option) { // 1. 从传入的 option 中提取 URL const url = option.url // 2. 在 body 中添加 script const body = document.getElementsByTagName("body")[0] const script = document.create.createElement("sc
2021-09-05 10:36:36
162
原创 防抖与节流（vue）
对于 refresh 非常频繁的问题, 进行防抖操作 防抖函数： debounce (func, delay) { let timer = null return function (...args) { if (timer) clearTimeout(timer) timer = setTimeout(() => { func.apply(this, args) }, delay) } }// vue 中使用, 比如刷新获取数据me
2021-09-04 11:11:53
106
原创 vue项目优化策略
1. 通过 CDN 优化 ElementUI 的打包(托管) 具体操作： （1） 在mian.js中, 注释掉 element-ui 按需加载的代码 （2） 在 index.html 的头部区域中, 通过 CDN 加载 element-ui 的 js 和 css 样式 // element-ui 的样式表文件 <link rel="stylesheet" href="CDN的css地址"> // element-ui 的 js 文件 <script src
2021-09-04 10:52:02
83
原创 VS Code 修改菜单栏字体大小
1. 打开VS Code,快捷键Ctrl+Shift+P,在弹出输入框中输入setting,点击首选项,在此setting.json文件中添加如下代码： { "editor.fontSize": 18, // 编辑器的字体大小 "window.zoomLevel": 0 // 缩放倍速, 整个窗体的大小级别 }...
2021-08-15 10:59:49
1002
原创 mongoDB 数据库
1. 什么是数据库 数据库：存储数据的仓库，可以将数据进行有序的分类别的存储。它是独立于语言之外的软件，可以通过 API 去操作它。 常见的数据库软件有：mysql, mongoDB, oracle2. mongoDB 数据库下载安装下载地址：https://www.mongodb.com/download-center/community3. mongoDB 可视化软件MongoDB可视化操作软件，是使用图形界面操作数据库的一种方式。4. 数据库相关概念 在一个数据库软
2021-08-08 10:55:31
286
原创 canvas 简介
一、canvas 简介1.1 什么是 canvas？（了解）是 HTML5 提供的一种新标签<canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆布 画布Canvas 是一个矩形区域的画布，可以用 JavaScript 在上面绘画。控制其每一个像素。canvas 标签使用 JavaScript 在网页上绘制图像，本身不具备绘图功能。canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。HTML5 之前的 web 页面
2021-08-08 10:52:49
3145
原创 Ajax跨域
(1) Ajax 是不能跨域请求，跨域时会报错误。(2) 跨域: 不符合同源策略是就会发生跨域。(3) 同源策略：指两个路径是否在同一个服务器下的一个判断标准。(4) 同源策略：同协议、同域名和同端口号。(5) Ajax 请求跨域文件时会报如下错误： XMLHttpRequest cannot load https://www.baidu.com, No 'Access-Control-Allow-Origin' header is present on the requested on the
2021-08-08 10:47:03
74
原创 es6新特性
(1) 新增 let, const 命令, 用来声明命令, 常量, 不存在变量提升, 不能重复声明同一变量名, 属于块级作用域,解决了闭包保存当前状态的问题.(2) 字符串遍历 for-of for (value of values) { console.log(value) } // value 代表的是值(3) includes() // 判断字符串或者数组是否包含指定的字符串, 返回的是 boolean(4) startsWith(), endsWith() // 检测字符串是否以指定的子字
2021-08-07 16:37:11
129
原创 vue 中组件之间数据通信方式
1. bus 总线的方式 (把 bus 定义在 vue 的 prototype 上, 在全局都可以使用) （1） 在 main.js 中添加如下代码 const Bus = new Vue() Vue.prototype.$bus = Bus (2) 在组件中 child1.vue (发送数据端) <button @click="sendTochild2">发送数据到child2</button> data() { return { child1Da
2021-08-03 14:44:48
267
原创 Git问题记录(Unknown SSL protocol error in connection to github.com:443)
问题: 向 gitHub 远程仓库 push 自己的代码时,报错误: Failed to connect to github.com port 443: Timed out. 解决办法： （1）在 git Bash Here 中执行： git config --global --unset http.proxy （2）再次执行提交命令： git push -u origin master...
2021-08-02 23:13:16
1760
原创 vue 项目上线
1 项目上线相关配置 1.1 通过 node 创建 web 服务器 创建 node 项目, 并安装 express, 通过 express 快速创建 web 服务器, 将 vue 打包生成的 dist 文件夹, 托管为静态资源即可, 关键代码如下: const express = require("express") // 创建服务器 const app = express() // 托管静态资源 app.use(express.static("./dist")) // 启动 we
2021-07-28 22:35:32
180
原创 vue 项目优化/扩展
1. 缓存路由组件对象 <keep-alive> <router-view></router-view> </keep-alive>优点：复用路由组件对象, 复用路由组件获取的后台数据2. 路由组件懒加载 import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) export default new vueRouter({ routes: [{
2021-07-26 22:36:41
128
原创 vue中，使用 moment组件实现日期过滤器
1. 安装 moment npm install moment --save-dev2. 在项目的根目录 src 下, 新建一个 filters 文件夹, 并在此文件夹下, 新建一个 filter.js 文件, 文件代码如下: import Vue from "vue" import moment from "moment" // 自定义过滤器 Vue.filter("dateFormat", (date) => { return moment(date).format("YY
2021-07-24 09:03:28
475
原创 javascript获取当前时间
javascript 获取当前系统时间// 获取当前时间函数function getCurrentTimer (format1, format2) { const time = new Date() const year = time.getFullYear() const obj = { month: time.getMonth(), date: time.getDate(), hour: time.getHours(), minutes: time.
2021-01-14 10:13:51
309
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人