自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(28)
  • 收藏
  • 关注

原创 vue-route

Vue-route (路由)理解:一个路由(route)就是一组映射关系,多个路由需要路由器(router)进行管理前端路由:key 是路径 value 是组件1.基本使用​ 1.1-- 安装 vue-routernpm i vue-router@3# 或者yarn add vue-router@3​​ 1.2-- 应用插件 Vue.use(VueRouter)​ 1.3-- 编写 router 配置项​ 1.3.1-- 在 src 下创建一个 router 文件夹

2022-02-20 11:46:41 497 1

原创 vue-Vuex

Vuex1.概念专门在Vue中实现集中式状态(数据)管理的一个Vue插件,对 vue 应用中多个组件的共享状态进行集中式的管理(读/写),也是一种组件间通信的方式,且适用于任意组件间通信原理图:2.何时使用:​ 多个组件需要共享数据时3.安装 Vuex使用 npm 或者 yarn 安装 Vuexnpm i vuex@3# 或者yarn add vuex@34.搭建Vuex环境​ 4.1-- 在 src 中创建一个 store文件夹,并且在 store 中新建一个 js

2022-02-20 11:46:21 138

原创 vue-cli

vue-cli1. 单文件组件将一个组件相关的html结构,css样式,以及交互的JavaScript代码从html文件中剥离出来,合成一个文件,这种文件就是单文件组件,相当于一个组件具有了结构、表现和行为的完整功能,方便组件之间随意组合以及组件的重用,这种文件的扩展名为“.vue”,比如:“Home.vue”。需要使用第三方构建工具将vue文件转换为正常的html文件才能被浏览器解析。比如webpack和官方提供的:vue-cli。webpack是什么Webpack 是一个前端资源的打包工具,它

2022-02-20 11:45:34 1793

原创 Vue-- 插槽

Vue插槽作用:让父组件可以向子组件指定位置插入html结构,也是一种组件间通信的方式,适用于 父组件 ===> 子组件 。分类:默认插槽、具名插槽、作用域插槽使用方式:默认插槽:父组件中: <Category> <div>html结构1</div> </Category>子组件中: <template> <div&

2022-02-11 16:26:15 109

原创 Vue--生命周期

Vue 生命周期生命周期:vue组件从创建到销毁的一系列过程vue的生命周期分为三大阶段:​ 创建阶段(4) 运行阶段(2) 销毁阶段(2)​ 每个阶段都有对应的函数,叫做钩子,又被称为钩子函数。生命周期钩子 = 生命周期函数 = 生命周期事件HTML :<div id="app"> {{msg}}</div>JS ://创建Vue实例,得到 ViewModelnew Vue({ // el:"#app", data:{

2022-02-11 16:25:20 464

原创 Vue--组件通信

组件通信​ 组件间的数据共享组件的关系:父子关系和非父子关系三种通信方式:​ 1.父子通信:父组件的数据要传递给子组件​ 2.子父通信:子组件的数据要传递给父组件​ 3.非父子组件通信:非父子之间的数据传递父向子传递数据​ 1.在父组件中通过v-bind传递数据 格式:<子组件 :自定义接收名称="要传递的数据"></子组件>​ 2.在子组件中通过props属性来接收数据 props:['自定义接收名称']​ 3.在子组件中就可以通过 自定义数

2022-01-12 21:32:17 182

原创 vue-组件基础

组件基础​ 组件就是用来提高代码的复用性的​ 组件的本质上是一个可复用的小号的 vue 实例,vue实例(new vue)是最大的跟组件​ 组件使用时就是一个自定义的标签template 标签:​ 作用:模板占位符,为了解决在 js 中直接书写 html 代码的问题​ 使用:template定义在body中,里面书写封装的HTML结构代码,在使用的时候,在组件component的 template中可以写一个css选择器,选中template标签就可以了全局组件​ 定义全局组件:Vue

2022-01-03 16:50:52 453

原创 vue-class与style绑定

Class 与 Style 绑定操作元素的 class 列表和内联样式是数据绑定的一个常见需求绑定HTML Class直接绑定​ :class="activeClass"对象语法​ :class="{'属性名':'属性值'}" 传给v-bind:class一个对象,以动态地切换:class数组语法​ :class='[]'把一个数组传给v-bind:class,以应用一个class列表用在组件上​ 数组 + 对象css:.red { color: red;}.gree

2022-01-03 16:49:27 410

原创 vue-计算属性

计算属性、侦听器、过滤器计算属性官方文档:对于任何复杂逻辑,都应该使用计算属性特点:1.计算属性中任意一个实例数据发生变化,计算属性就会重新计算,视图也会更新。​ 2.每一个计算属性都包含一个getter和setter​ 每调用一个计算属性,就相当于调用一次计算属性的getter,每当计算属性的值发生变化时,会默认调用setter​ 3.计算属性可以依赖多个vue实例中的数据基础例子<div id="app"> {{msg.split(',').revers

2022-01-03 16:45:18 495

原创 vue基础

Vue基础

2022-01-02 10:19:51 337

原创 mysql封装增删改的方法

封装一个增删改的方法使用 npm i mysql下载mysql模块// 导入 mysql 模块const mysql = require("mysql");创建连接池const pool = mysql.createPool({ host:"本地服务器", database:"数据库表名", user:"用户名", password:"密码", //可选部分 connectionLimit: 50, //连接池中最大的连接数 (默认

2021-12-27 11:41:37 167

原创 解决跨域问题-cors

cors 跨域资源共享使用 cors 中间件解决跨域问题cors 是 Express 的一个第三方中间件。通过安装和配置 cors 中间件,可以很方便的解决跨域问题使用步骤分为如下 3 步:1. 运行 npm i cors 安装中间件2. 使用 const cors = require('cors') 导入中间件3. 在路由之前调用 app.use(cors()) ...

2021-12-26 16:10:46 477

原创 express+ejs

expressexpress的介绍express官方网址:www.expressjs.com.cnExpress 是一个基于 Node.js 平台的极简、灵活的 web 应用开发框架。使用 Express 可以快速地搭建一个完整功能的网站。通俗理解:Express的作用和node.js内置的http模块类似,都是专门用来创建web服务的。安装expressnpm install express创建服务器//和原生的http请求不同,这里首先引入 express模块const expres

2021-12-20 09:38:10 305

原创 MySql条件查询及连接

where子句where子句用于过滤记录单条件# 查询 id 等于1的记录select * from books where id = 1;# 查询 price 大于100的记录select * from books where price > 100;# 查询 price 小于100的记录select * from books where price < 100;# 查询 price 大于等于100的记录select * from books where price

2021-12-14 20:27:42 1260

原创 MySql的增删改查

MySQLMySQL是一个关系型数据库管理系统安装与配置安装教程:https://blog.csdn.net/qq_34444097/article/details/82315587概念:数据库(database)​ MySQL里面存储了很多数据库,我们可以理解为电脑上的一个文件夹。一般情况下,一个项目对应一个数据库。​ 每一个数据库是由多张表组成的。表:字段​ 相当于表格中的表头。记录​ 一条记录相当于表格中的一条内容。进入命令窗口win+r 输入cmd 进入命令窗口,

2021-12-12 15:09:41 496

原创 yarn(八)

yarnyarn 也是一个包资源管理器,与npm的功能是一样的,不过yarn的下载速度更快目标:取缔 npm下载使用:​ 用 npm 下载npm i yarn -g初始化项目:创建package.jsonyarn init;//快速生成yarn init -y;安装单个依赖yarn add 模块名;指定版本安装yarn add 包名@版本号卸载依赖yarn remove 包名...

2021-12-11 15:10:25 404

原创 package.json(七)

node_moudles的问题​ 如果我们在项目中下载了很多第三方模块,那么多人拷贝你的项目是就会很慢。package.json​ 每个项目的根目录下,一般都会有一个package.json文件,定义了这个项目需要哪些模块,以及该项目的配置信息(项目名,作者,版本,许可证等)​ 所以package.json应该是在 初始化项目时进行创建//初始化项目的命令(创建package.json)npm init; //需要填写配置信息​ 执行该命令后,会让你输入 项目名,版本号,入门文

2021-12-11 14:47:51 241

原创 node第三方模块(六)

什么是第三方模块?简单来说就是别人写好的, 具有特定功能的模块, 就是第三方模块,我们需要下载才可以使用。获取第三方模块网址:npm (npmjs.com)存储和分发第三方模块的仓库使用npm命令下载第三方模块​ npm是随node一起安装的包管理工具,只要安装了node,就可以使用npmnpm的作用允许用户从npm服务器下载别人写好的**第三方模块**到本地使用允许用户从npm服务器下载别人写好的**命令行程序**到本地使用允许用户上传自己写好的第三方模块和命令行程序到npm服务器

2021-12-11 11:08:51 77

原创 nodejs获取请求的参数(五)

nodejs 获取请求的参数post和get的区别:post:1.post的语义是 推送,邮寄, 使用场景为 向服务器推送用户信息。比如,注册,登录。2.安全的,参数不会出现在地址栏3.传输的大小不会被浏览器限制,理论上可以相传多大的文件就传多大的文件。但是一般服务器会限制你们的上传大小。get:1.get的语义是 获取, 使用场景为 获取服务器上的数据。比如,访问某一个页面,获取列表信息等。2.不安全。3.上传大小最多只有4KB。案例1://核心模块const http = req

2021-12-09 20:22:29 954

原创 node-http模块(四)

http介绍什么是http传输协议。客户端以什么样的形式发送数据给服务器端服务器端以什么样的形式发送数据给客户端http协议基于TCP面向连接请求方式getget 的语义时获取的意思。如果要从服务器端获取数据,则使用getget 的参数会在地址栏显示,不安全postpost 的语义时邮寄的意思。如果要将本地的数据推送给服务器端,则使用postpost 的参数不会在地址栏显示,安全常见的状态码200:成功 2开头的都表示成功404:请求的资源不存在。 4开头的都表示客户端错误。

2021-12-08 19:45:23 886 2

原创 node 路径模块(三)

路径模块path模块包含了一系列处理和转换文件路径的工具集合。为什么要使用路径模块不同操作系统的路径分隔符是不同的。window下是\ linux是/path.join()用于连接路径。会正确使用当前系统下的分隔符。【注意】:路径的选择大多数情况下,在node中我们应该使用绝对路径。因为相对路径相对的是命令行工具打开的当前目录。在读取文件或者设置文件的路径时,都会选择绝对路径。//导入fs模块const fs = require("fs");//引入path路径const path

2021-12-08 19:44:39 562

原创 node 的模块化(二)

node 的模块化模块的分类内置模块(核心模块)由node 官方提供。常见的有:fs, path, http等自定义模块 用户创建的每一个 js 文件都是一个自定义模块第三方模块 由第三方开发, 使用之前需要下载安装。模块作用域和函数作用域类似,在自定义模块中的变量,函数等成员,只能在当前模块中使用,这种模块级别的访问限制,就叫做模块作用域。优点:防止全局变量污染。模块的导入和导出导出:新建一个a.js文件,里面的代码如下://导出一个对象,对象中的值就被暴漏出去了。modul

2021-12-08 19:44:01 411

原创 node介绍(一)

node介绍为什么JavaScript可以在浏览器中运行在浏览器中有js的解析器,也叫做解析引擎。不同浏览器的引擎是不同的。IE:charka(查克拉) Safari:jscode Chrome:V8 (所有浏览器引擎中最好的一个)为什么JavaScript可以操作BOM和DOM每个浏览器都内置了DOM和BOM这样的API函数,只能在浏览器中使用。什么是nodejsnodejs是一个基于Chrome V8 java 引擎的 JS 运行环境nodejs 可以看作是一个解析器,是一个运行时

2021-12-07 19:52:17 1402

原创 arguments的使用

arguments的使用当我们不确定有多少个参数传递时,可以用arguments来获取。只有函数才有arguments对象在JavaScript中,arguments实际上它是当前函数的一个内置对象。所有函数都内置了一个arguments对象中存储了传递的所有的实参​ arguments存放的是传递过来的实参​ arguments展示形式是一个伪数组,因此可以进行遍历。伪数组具有以下特点:1.具有length属性2.按索引方式储存数据3.不具有数组的push,pop等方法案例://

2021-12-06 12:19:54 143

原创 cookie、localStorage、sessionStorage

JSON字符串概念拥有特殊格式的字符串。用于描述对象或数组的字符串。作用主要用于前后端交互【题外话】json的诞生是为了取代繁琐本质的xml格式。语法1.{} 表示对象2.[] 表示数组3.键与值之间用:分割。4.属性之间用,分割。5.属性名必须用双引号6.值可以是字符串,数字,布尔值,null,对象,数组。不要用NaN.7.最后一位不能是逗号。JSON与对象之间的转换JSON转对象JSON.parse():将一个符合json格式的字符串转为对象或数组。 如果不符合会报错。

2021-11-25 19:46:43 169

原创 es6 set,map,symbol

ES6的Set、Map、SymbolES6提供了两个新的引用数据类型 set 和 mapset:新的数据结构,可以理解为集合。类似于数组,set的值都是唯一的。但是不能使用索引来获取元素定义: new Set();//创建一个空的set new Set(arr);//创建一个有值的set属性和应用:delete: 删除一个值。返回布尔值。true:删除成功 false:删除失败let arr = [1, 2, 3, 4, 5];let set = new Set(arr);

2021-11-22 21:51:02 363

原创 js继承的方法和实现原理

js继承的方法和实现原理ES6之前并没有专门用于继承的关键字。ES6之后有了Class和extends​ 实现继承首先需要一个父类;(继承谁,提供继承的属性)//父类function Person(name,age){ this.name = name; this.age = age;}1.原型链继承​ 将子类的原型对象 修改为 父类的实例对象。(让新实例的原型等于父类的实例)Son.prototype = new Father();//重要//父类function

2021-11-22 19:50:53 720 1

原创 Js构造函数

构造函数创建对象的几种方式://字面量var obj = {};//构造函数var obj = new Object();//创建一个数组var arr = new Array();1.什么是构造函数?在JavaScript中,用new关键字来调用的函数,称为构造函数。构造函数首字母一般大写2.为什么要使用构造函数?​ 举个例子:我们要录入每一位同学的个人信息,那么我们可以创建一些对象,比如:var p1 = {name:'小明',age:18,sex:'男'};var p2

2021-11-22 19:50:05 420 1

空空如也

空空如也

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

TA关注的人

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