自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

非凡主力

为了祖国的复兴而读书,嘻嘻

  • 博客(151)
  • 资源 (1)
  • 收藏
  • 关注

原创 vue 中引入js文件json数据 在组件中使用 避免打包 详细教程

vue中如果需要引入外部js文件,避免被打包我们可以放到public文件下:在 public 下新建文件夹 json 中有 xmlList.js 文件此时xmlList就不会被打包编译。在组件中使用数据在html文件中引入<script src="json/xmlList.js"></script>xmlList.jslet xmlList = [ {"name":"姓名一","url":"www.abc.com"}, {"name":"姓名二","url":

2021-07-28 21:51:31 11

原创 Vue 项目里痛点及问题解决办法

Vue 项目里戳中你痛点的问题及解决办法(更新)https://juejin.cn/post/6844903632815521799

2021-07-25 21:19:11 20

转载 axios的封装和api接口的统一管理

回归正题,我们所要的说的axios的封装和api接口的统一管理,其实主要目的就是在帮助我们简化代码和利于后期的更新维护。一、axios的封装在vue项目中,和后台交互获取数据这块,我们通常使用的是axios库,它是基于promise的http库,可运行在浏览器端和node.js中。他有很多优秀的特性,例如拦截请求和响应、取消请求、转换json、客户端防御XSRF等。所以我们的尤大大也是果断放弃了对其官方库vue-resource的维护,直接推荐我们使用axios库。如果还对axios不了解的,可以移步ax

2021-07-22 10:55:23 30

原创 window10系统,几分钟不操作就自动黑屏处于睡眠状态

最近装了建设银行客户端一直隔一分钟就黑屏,网上试了很多方法,注册表都修改过了,一直没得到解决,今天捣鼓了一下困扰了许多天的问题得到了解决,下面分享一下给有需要的小伙伴,如果喜欢请给个点赞支持。桌面——》右键 个性化,菜单左侧点击锁屏界面——》拖到最下面有个“屏幕保护程序设置”。在屏幕保护程序设置里面设置时间长一点。大功告成!...

2021-07-21 12:43:52 11

原创 Vue 3全新的Web开发构建工具 —— Vite

为祖国的复习而读书!—— 非凡主力Web开发构建工具,它是一个基于浏览器原生ES模块导入的开发服务器,在开发环境下,利用浏览器去解析import,在服务器端按需编译返回,完全跳过了打包这个概念,服务器随启随用。同时不仅对Vue文件提供了支持,还支持热更新,而且热更新的速度不会随着模块增多而变慢。在生产环境下使用Rollup打包。Vite具有以下特点: 快速的冷启动 即时热模块更新(HMR,Hot Module Replacement) 真正按需编译 Vite是在推出Vue 3的时候开发的,

2021-07-19 09:23:21 24

原创 JS移动端浏览器取消右划后退的几种方法

方法一:var mo=function(e){ e.preventDefault();}/***禁止滑动***/function stop(){ //禁止页面滑动 document.addEventListener("touchmove",mo,false);}stop()方法二:屏蔽浏览器的后退事件。 //防止页面后退 history.pushState(null, null, document.URL); window.addEventListener('p.

2021-07-04 09:42:01 38

原创 vue 路由之间传值 (编程式导航)

//params形式:参数不显示在地址栏this.$router.push({ name: 'details', params: { userId: this.num }})//获取console.log(this.$route.params.userId);//query形式:参数显示在地址栏this.$router.push({ path: 'deta

2021-06-19 13:39:24 27

原创 数组去重 将Set数据结构转换为数组

将Set数据结构转换为数组,通常有以下两种方法const arr = [1,1, 2,2,3, 4 ]const s = new Set(arr);// 方法一 用方括号直接包裹用“…”扩展后的Set数据结构const newArr = [ …s ];console.log(newArr); // [ 1, 2, 3, 4 ];// 方法二 用Array.from()转换Set数据结构const newArr = Array.from(s);console.log(newArr); // [

2021-06-17 18:06:35 27

原创 vue项目中使用swiper插件

先说说在vue中如何引用swiper1.npm命令安装swipernpm install swiper --save-dev2.在需要用到swiper插件的组件中引入swiper<script>import Swiper from "swiper";</script><style lang="scss" scoped>@import "../....

2020-04-28 22:12:02 4100 1

原创 vue 一级路由二级路由 父子路由高亮

一级路由<template> <div id="app"> <div> <router-link to="/Home">Home</router-link>| <router-link to="/about">About</router-link> </div&g...

2020-04-26 23:43:41 855

原创 配置淘宝镜像

1.使用我们定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:npm install -g cnpm --registry=https://registry.npm.taobao.org2.把npm的register给永久设置过来就好了,这样使用cnpm或者npm就没差别了。(可选可不选)npm config set registry https://regist...

2020-04-25 18:24:13 371

原创 元素 居中 弹出框

实现元素垂直居中的方法很多,相信大家都能说出几种。相对于PC端,移动端的方法会更多点,平时在网上收集了一些,在此贴出来分享给大家,仅供参考。方法1:table-cellhtml结构<div class="box box1"> <span>垂直居中</span></div>CSS.box1{ display: ta...

2020-04-24 22:17:22 94

原创 webpack 入门教程详细教程

webpack中文网:https://www.webpackjs.com/一、webpack是什么? 4.xwebpack是一个现代javascript应用程序的静态模块打包器(module bundler)。webpack简单的说一个模块打包器。二、为什么要使用webpack?webpack能解决什么问题?现在很多的网页都可以看做是功能丰富的应用,他们拥有着复杂的java...

2020-04-17 10:23:57 330

原创 PS - 除去水印,文字

第一步:框选文字部分第二步:选择 - 色彩范围 - 吸管 - 吸取文字颜色 - 颜色容差 (调大)第三步:选择 - 修改 - 扩展 (2像素)第四步:内容识别 (shift + f5)完美去文字...

2020-04-13 23:15:58 154

原创 Vant 的 rem 引用

引入:npm i lib-flexible -Snpm i postcss-pxtorem -Dmain.jsimport "lib-flexible/flexible";项目根目录下创建:postcss.config.js//postcss.config.jsmodule.exports = { plugins: { auto...

2020-04-11 00:57:41 169

原创 移动端点击300ms 延时 FastClick

在vue中使用 // 安装 npm install fastclick -S // 引入 main.js 中 import FastClick from 'fastclick' // 使用 FastClick.attach(document.body);

2020-04-10 10:44:14 80

原创 vue keep-alive 保留切换后的状态,上一个状态,之前状态,tab切换

keep-aliveProps:include - 字符串或正则表达式。只有名称匹配的组件会被缓存。exclude - 字符串或正则表达式。任何名称匹配的组件都不会被缓存。max - 数字。最多可以缓存多少组件实例。用法: 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。和 相似, 是一个抽象组件:它自身不会渲染一个 DOM 元素,也不会出现在组件的父组件链中。当组件在 ...

2020-04-06 17:48:25 758

原创 module.exports 与 exports,export 与 export default 关系和区别

首先我们要明白一个前提,CommonJS模块规范和ES6模块规范完全是两种不同的概念。CommonJS模块规范Node应用由模块组成,采用CommonJS模块规范。根据这个规范,每个文件就是一个模块,有自己的作用域。在一个文件里面定义的变量、函数、类,都是私有的,对其他文件不可见。CommonJS规范规定,每个模块内部,module变量代表当前模块。这个变量是一个对象,它的exports属...

2020-04-06 10:39:30 119

原创 fs 模块

node fs 文件系统1、浏览器js 不允许操作文件。2、服务端node通过fs核心模块文件系统来操作。(增,删,改,查)fs 重点操作文件操作:读取、写入、删除、判断存在性,文件信息目录操作:创建、删除、读取fs 操作都有两个版本:同步版本 (接力赛跑)异步版本 (比赛跑)1、读取文件格式:readFile(异步)readFileSync (同步)readFile(...

2020-03-31 17:42:23 111

原创 vue 全局组件和局部组件

组件分类:全局组件 局部组件​ 全局组件在任何地方都可以使用​ 局部组件只能在当前实例里用全局组件Vue.component("组件名称",{​ data(){​ return {​ msg:"123"​ }​ },​ methods:{​ fn()...

2020-03-30 21:17:39 169

原创 vue-cli 3.0 中 vue.config.js 配置文件

vue.config.js配置文件在使用vue-cli3创建项目后,因为webpack的配置均被隐藏了,当你需要覆盖原有的配置时,则需要在项目的根目录下,新建vue.config.js文件,来配置新的配置。const url = require('url');const queryString = require('querystring');const path = require...

2020-03-28 13:23:53 3315 1

原创 mock.js 教程

一、Mock.js的功能:①基于数据模板生成数据②基于HTML模板生成数据③拦截并模拟ajax请求二、Mock.js的安装:① 下载mock.js文件<script type="text/javascript" src="http://mockjs.com/bower_components/mockjs/dist/mock.js"></script>② np...

2020-03-27 23:12:05 149

原创 vscode 插件

VS Code 写 Markdown — “Markdown Preview Enhanced”

2020-03-27 19:59:28 165

原创 Generator + co

GeneratorGenerator 函数是一个普通函数。区别:function关键字与函数名之间有一个星号。(ES6 没有规定,function关键字与函数名之间的星号,写在哪个位置都能通过。)函数体内部使用yield表达式,定义不同的内部状态(yield在英语里的意思就是“产出”)。调用 Generator 函数后,该函数并不执行,返回的也不是函数运行结果,而是一个指向内部状态的指...

2020-03-25 04:35:35 140

原创 面向对象 OOP es6 Class 类

面向对象编程 (Object Oriented Programming)单例设计模式单例模式解决的问题高级单例模式基于单例模式实现模块化开发工厂模式单例设计模式1、表现形式 (对象)var obj = { xxx:xxx};2、作用把描述同一件事务的属性和特性进行 分组,归类(存储在一个堆内存空间中)。因此避免了全局变量之间的冲突和污染var pa...

2020-02-06 22:43:20 94

原创 vue v-model 单选 复选 下拉 表单

v-model表单控件在实际业务较为常见,比如单选、多选、下拉、输入框等,用它们可以完成数据的录入,校验,提交等。例如在输入框上使用时,输入的内容会实时映射到绑定的数据上。使用v-model 后,表单控件显示的值只依赖所绑定的数据,不再关心初始化时的value属性的值。使用v-model...

2020-01-12 09:01:04 250

原创 vue的计算属性computed与侦听器watch

vue的计算属性computed和侦听器watch都是监听数据变化。computed (计算)其在vue单文件组件中就是对数据进行简单的一些逻辑计算,在项目开发中方便我们对原始数据处理。重要的是计算属性基于它的响应式依赖进行缓存的。只有当响应依赖关系变了即值发生变化了才会重新计算。否则,直接利用缓存,这样既避免多次调用函数又提升性能。<div id="app"> {{txt}}...

2020-01-09 09:48:00 135

原创 vue 生命周期

生命周期1.vue的生命周期是什么 ?2.vue生命周期的在项目中的执行顺序3.vue中内置的方法 属性和vue生命周期的运行顺序(data、methods、computed、watch)4.自己构造的方法与vue生命周期的运行顺序5.总结一、vue的生命周期是什么​ vue每个组件都是独立的,每个组件都有一个属于它的生命周期,从一个组件创建、数据初始化、挂载、更新、销毁,这就...

2020-01-08 09:33:30 242

原创 Vue 详解

认识vue.jsvue 是什么官方文档:Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。如果你想在深入学习 Vue 之...

2019-12-28 09:16:29 155

原创 node + express + axios 增删改查接口API

const express = require("express");const path = require("path");const fs = require("fs");const app = express();const db = require("./src/mock/data.json");// 对外开放 静态资源目录app.use(express.static(...

2019-12-16 23:38:07 277

原创 node-dev工具和supervisor工具

简介node-dev是一个node.js开发工具,当文件被修改时,它会自动重新启动node进程。使用介绍1、安装npm install -g node-dev2、运行服务node-dev index.js3、Node-dev 可以当有js文件修改后自动去重启nodejs进程, 这样就不用每次ctrl+c 终止在重启了,而且不仅支持js文件, .json .node .coffee...

2019-12-08 22:57:20 163

原创 npm -- nodejs强大的包管理器

npm是什么NPM的全称是Node Package Manager,是随同NodeJS一起安装的包管理和分发工具,它很方便让JavaScript开发者下载、安装、上传以及管理已经安装的包。npm通常是和node.js一起安装的npm,node package manager,是 Node 的模块管理器,功能极其强大。它是 Node 获得成功的重要原因之一。随着一系列基于node...

2019-12-04 21:53:20 343

原创 babel 转码器

初识node1.node定义Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。2.node的特点1.事件驱动2.非阻塞式 I/O3.轻量又高效4.单线程3.Node可以做什么?1.操作文件fs(重点讲)2.操作http服务器(重点讲)3.操作进程(这个月不学习,但是大家要知道)4.理解node环境和浏览器环境的区别1.全局环境下thi...

2019-11-29 11:15:54 142

原创 箭头函数

箭头函数优点:语法简单可以隐式返回匿名函数<script> const number = [5, 6, 13, 0, 1, 18, 23]; const double = number.map(function (number) { return number*2; }); const double2 = number...

2019-10-14 22:11:34 234

原创 JavaScript Array map()方法

Array map()方法定义:对数组中的每个元素进行处理,得到新的数组;特点:不改变原数组;例子:const array = [1, 3, 6, 9];const newArray = array.map(function (value) { return value + 1;});console.log(newArray); // [2, 4, 7, 10]console....

2019-10-14 21:35:25 77

原创 JS 随机数

前言:对象在JavaScript 中被称为引用类型的值。Math 是引用类型的单体内置对象,Math对象提供了很多属性和方法,用于辅助完成复杂的数学计算任务。Math 对象方法方法描述Math.ceil(x)进行上舍入,即向上取整。 例:Math.ceil(25.9) //26 Math.ceil(25.1) //26Math.floor(x)进行向下舍入,即...

2019-10-05 22:57:48 69

原创 Common JS

模块规范CommonJS模块规范主要分为三部分:模块引用、模块定义、模块标识。模块引用 var math = require("math");带路径与不带路径的区别模块引入没有带路径,引用的是当前所在目录下的node_modules目录。模块引入的有其他路径,就需要使用到相对路径或绝对路径。var add = require(’./add.js’)模块定义module对象:在...

2019-09-28 22:03:08 229

原创 送给同学们的话

一转眼,我们分别了,但是总觉得我们好像刚刚进班的第一天,很多人走了,也有人来了,有些人变了,也有些人没变。大家的感情从陌生到熟悉,从疏远到一点点团结起来,一点一滴都铭记我心中,随着同学的调班,离去,我们可能会变得疏远,但希望大家之间的感情还是未曾改变,我们都在改变,我们也无法阻止这些改变,没有永远的在一起,但可以拥有过去的回忆!我相信每一位同学都能对学习重视起来,一心向前。学习是以时间保证的,抓...

2019-09-27 11:00:42 492 10

原创 ES6 知识点总结

let 和 const 命令let 用来声明变量,只在let命令所在的代码块中有效。【代码块:使用花括号包住的内容称为代码块{}】{ let a = 10; var b = 1;}a // ReferenceError: a is not definedb // 1表明:let声明的变量只在它所在的代码块有效。for循环的计数器,就很合适使用let命令。for (let...

2019-08-23 22:46:16 336

原创 移动端 效果案例

效果演示:横向滚动源代码: <div class="wrapper"> <div class="content"> <ul class="ul"> <li><img src="https://p1.meituan.net/128.180/movie/648bbced1...

2019-08-21 11:35:51 506

书城管理 - 副本.rar

vue全家桶+node+express+axios+vuex 开发web应用掌上书城现在发布出来,供大家一起学习,希望对大家了解vue全家桶有帮助!

2020-04-17

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人 TA的粉丝

提示
确定要删除当前文章?
取消 删除