- 博客(15)
- 收藏
- 关注
RSS订阅原创 iframe的优缺点
简介iframe作为HTML标签使用，iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。简单来说，iframe能够将网页插入到另一个网页中。现在已逐步被ajax所代替。属性优点1.iframe能将一个网页作为一部份嵌套在另一个网页中。2.如果有多个网页引用iframe，那么你只需要修改iframe的内容，就可以实现调用的每一个页面内容的更改，方便快捷。（方便后期修改维护）3.网页如果为了统一风格，头部和版本都是一样的，就可以写成一个页面，用iframe来嵌套，可以增加代码的
2021-06-15 09:16:51
235
原创 项目中如何修改element-ui的默认样式
前言vue中我们经常会使用一些第三方的组件库，可以达到快速搭建项目界面布局的效果，无非就是用什么组件库的问题。但是，不管我们使用element ui、vant或是别的什么组件库，修改样式是必不可少的一个工作。修改element-ui的默认样式1、去除scopedscoped作用：vue每个文件的样式部分都会有个scoped属性，该属性限制样式只在当前文件所在的作用域生效，而不会影响其他地方。scoped的实现原理：vue中的scoped属性的效果主要通过PostCSS转译实现，如下是转译前的
2021-06-11 10:55:54
645
原创 vue-router的鉴权、守卫
一、什么是vue-routervue-router是路由导航守卫，又叫路由的钩子函数或者路由的生命周期函数。就是路由从开始进入路径到跳转结束这个过程中，到了某个阶段会自动执行的函数。原理：路由就是用来解析URL以及调用对应的控制器，并返回从视图对象中提取好的网页代码给web服务器,最终返回给客户端。路由的两种模式：hash模式：在浏览器中符号的“#”，以及#后面的字符称之为hash，用window.location.hash读取;特点：hash虽然在URL中，但不被包括在HTTP请求中；
2021-06-10 10:13:57
989
原创 windows安装Nginx
简介Nginx (engine x) 是一个高性能的HTTP和反向代理服务器，也是一个IMAP/POP3/SMTP服务器。Nginx是由伊戈尔·赛索耶夫为俄罗斯访问量第二的Rambler.ru 站 点（俄文：Рамблер）开发的. 它也是一种轻量级的Web服务器，可以作为独立的服务器部署网站（类似Tomcat）。它高性能和低消耗内存的结构受到很多大公司青睐，如淘宝网站架设。安装步骤1、下载下载地址：http://nginx.org/en/download.html （Nginx官网）2、下
2021-06-07 14:01:58
229
原创 axios拦截、api的统一管理
简介axios专门用于我们去请求数据，它本身就支持链式的调用，但是我们写项目的时候，每个页面都会发送请求，如果频繁的调用axios会写很多重复的代码，所以我们统一封装一个方法，我们的域名一个项目一般是不会改变的，所以我们可以把那些不变的都封装在这个方法中。然后在另一个文件统一管理我们的请求接口。方便我们后期阅读和维护。封装axios的具体步骤1、安装axios到本地npm install axios --save-dev2、在项目src目录中创建request文件夹包含api.js、http
2021-06-06 21:46:22
139
原创 webpack打包优化
这里写目录标题一、webpack打包的作用在根目录下创建一个`vue.config.js`文件，名字不可以更改，下面的代码都在这个js文件里面实现二、项目开始时的准备1、设置==proxy==跨域2、配置==alias==别名三、项目结束前（打包后）1、修改==静态资源==路径(打包前必做，否则打包后项目无法运行)2、关闭生产环境下的==SourceMap==映射文件3、使用CDN加速优化4、去除console.log()打印以及注释5、终端输入`npm run build`打包（结束）一、webpack
2021-06-06 20:54:25
330
原创 vant-ui按需引入
安装插件#先安装vant-uicnpm install vant-ui --save # 再安装按需引入的插件cnpm i babel-plugin-import -D在babel.config.js中添加配置plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: true }, 'vant'] ]创建一个plugin文件夹，在plug
2021-06-04 09:23:37
123
原创 vue中keep-alive的使用
什么是keep-alive？keep-alive 是 Vue 的内置组件，当它包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。和 transition 相似，keep-alive 是一个抽象组件：它自身不会渲染成一个 DOM 元素，也不会出现在父组件链中。作用在组件切换过程中将状态保留在内存中，防止重复渲染DOM，减少加载时间及性能消耗，提高用户体验性。原理在 created 函数调用时将需要缓存的 VNode 节点保存在 this.cache 中／在 render（页面渲染） 时，如
2021-06-03 21:58:37
421
原创 配置多环境变量
多环境变量是什么?在vue的开发中有很多不同的环境，比如开发环境、测试环境、生产环境等，并且每一种环境下访问的域名，都是不一样的，所以，就可以通过配置多环境变量来执行不同的环境。怎么配置多环境变量？第一步：在package.json文件中，添加新的编译打包节点通过 npm run serve 启动本地 , 执行 development通过 npm run test 打包测试 , 执行 testing通过 npm run build 打包正式 , 执行 production"scripts"
2021-06-02 14:34:21
189
原创 Vue-router
一、前端路由的概念路由就是用来解析URL以及调用对应的控制器，并返回从视图对象中提取好的网页代码给web服务器,最终返回给客户端。更新视图但不重新请求页面，是前端路由原理的核心之一。vue的单页面应用是基于路由和组件的，路由用于设定访问路径，并将路径和组件映射起来。传统的页面应用，是用一些超链接来实现页面切换和跳转的。在vue-router单页面应用中，则是路径之间的切换，实际上就是组件的切换。二、路由的两种模式 Hash — 默认值，利用 URL 中的hash("#") .
2021-05-27 11:07:32
79
原创 Vuex
一、Vuex是什么？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。二、它由五部分组成：state: 数据actions:可以包含异步操作mutations: 唯一可以修改state数据的场所getters: 类似于vue组件中的计算属性，对state数据进行计算（会被缓存）modules:模块化管理store（仓库），每个模块拥有自己的 state、mutation、action、getter3、使用方法在跟目录下创建一个store文件夹，里面创建一个ind...
2021-05-24 08:22:57
61
原创 Vue的生命周期函数
vue的一生：人从出生到童年、青年、壮年、不惑，到死亡。会经历不同的时期。vue实例也不例外。每个vue实例从创建到销毁的过程就是vue的一个生命周期，每个阶段都有对应的钩子函数，当我们想在vue的不同时期操作vue实例是，就可以在不同的钩子函数中进行要知道vue的生命周期是什么，主要从以下几个方面来讲：1.vue的生命周期是什么2.vue生命周期的在项目中的执行顺序3.vue中内置的方法属性和vue生命周期的运行顺序（methods、computed、data、watch）.
2021-05-21 09:15:33
185
原创 Vue的组件通信
前言组件是 vue.js最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。一般来说，组件可以有以下几种关系：如上图所示，A 和 B、B 和 C、B 和 D 都是父子关系，C 和 D 是兄弟关系，A 和 C 是隔代关系（可能隔多代）。方法一：props/$emit1、父传子。父组件通过在子组件标签上设置自定义属性向子组件发送数据，子组件通过props来接收父组件传过来的数据。1、父组件的代码。 <template>
2021-05-21 08:36:09
53
原创 promise的介绍
关于promise的一些问题。1、什么是promise？2、你对promise的理解？3、promise用过吗？promise从语法上说就是一个对象，也能解决回调地狱，可以链式调用。它也有缺点，无法取消 Promise，一旦新建它就会立即执行，无法中途取消。名词约定：如果首字母小写，对象指的是“Promise实例对象”；如果首字母大写且单数形式，表示“Promise构造函数”；如果首字母大写且复数形式，用于指代“Promises规范”；并且它有三种状态padding等待状态，fulf
2021-05-07 21:54:49
127
原创 小程序中的接口请求封装
1、在小程序中普通的接口请求： 接口数据网络请求，在页面的js文件中，监听页面加载里，也就是onLoad中：onLoad: function (options) { //保存this var that = this； //接口请求 wx.request（{ url："请求的路...
2021-05-07 19:24:30
291
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人