煎饼狗子ing-CSDN博客

原创 Echarts在vue-cli的基本使用

1.基本使用1.安装在已经建好的脚手架的终端中输入错误输入：npm install echarts --save正确输入：npm install [email protected] --save输入错误报错的解决方案：#第一步卸载之前安装的echars版本npm uninstall echarts --Save#第二步输入指定版本号安装npm install [email protected] --save2.全局引用main.js 中配置import echarts from 'echart

2021-12-31 17:11:34 591

转载 ES6—异步解决方案

Promise对象是一种异步编程解决方案，Promise是一个容器，保存着将来才会执行的代码；从语法角度来说Promise是一个对象，可以用来获取异步操作的消息。异步操作，同步解决，避免了层层嵌套的回调函数特点Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）、rejected（已失败）状态不受外界影响，只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。Promise对象的状态改变，只有两种可能：从pending变

2021-10-19 18:40:01 324

原创 vuex状态管理机

1.介绍Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。应用场景：同级别组件之间通讯let comA = {}let comB = {}2.基本使用：Vuex 使用单一状态树，用一个对象就包含了全部的应用层级状态，作为一个“唯一数据源”而存在，这也意味着，每个应用将仅仅包含一个 store 实例。Vuex 通过 store 选项，提供了一种机制将状态从根组件“注入”到每一个子组件中

2021-10-14 20:29:26 265

原创 Vue-Router路由管理器

1.介绍vue-router是vue的一个插件，用来提供路由功能。通过路由的改变可以动态加载组件，达到开发单页面程序的目的。在html文件中使用时需要引入vueRouter(先引入vue.js,在引入vueRouter)2.基本使用1)声明组件 let com1 = {template:`<div>this is com1</div>`} let com2 = {template:`<div>this is com2</div>`} let c

2021-10-14 14:29:10 391

原创 vue声明周期及模板语法

文章目录1.vue特点2.Vue与jquery的区别（扫地，清洁）3.MVVM（软件设计模式）4.生命周期（钩子函数）5.模板语法5.1文本插值Vue是一套用于构建用户界面的渐进式框架(根据自身需求，选择框架的中的工具,VUE不强求你一次性接受并使用它的全部功能特性)。与其他大型框架不同的是，Vue被设计为可以自底向上逐层应用。Vue的核心库只关注视图层，不仅容易上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue也完全能够为复杂的单页应用提供驱动。用来做单

2021-10-13 20:09:37 179

原创 vue组件机制

1.组件机制组件 (Component) 是 Vue.js 最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。在较高层面上，组件是自定义元素，Vue的编译器为它添加特殊功能。在有些情况下，组件也可以表现为用is特性进行了扩展的原生 HTML 元素。组件注册的时候需要为该组件指定各种参数。因为组件是可复用的 Vue 实例，所以它们与 new Vue 接收相同的选项，例如 data、computed、watch、methods以及生命周期钩子等。仅有的例外是像 el 这样根实例特有的选项

2021-10-12 22:34:10 175

原创 Class类、Symbol

1.class类1)介绍ES6 提供了更接近传统语言的写法，引入了 Class（类）这个概念，作为对象的模板。通过class关键字，可以定义类。ES6 的class可以看作是构造函数一个语法糖语法糖：具有特殊功能的代码写法，内部封装了一些方法，让一些复杂代码的编写及其用法变得简单2)构造器constructor方法是类的默认方法，通过new命令生成对象实例时，自动调用该方法。一个类必须有constructor方法，如果没有显式定义，一个空的constructor方法会被默认添加。// 定义一

2021-09-28 17:57:05 183

原创迭代器Iterator

迭代器（Iterator）它是一种接口，为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口，就可以完成遍历操作（即依次处理该数据结构的所有成员）实现了iterator接口的数据，即是可迭代的数据Iterator 的作用：1.为各种数据结构，提供一个统一的、简便的访问接口,提供统一的访问机制（for of循环）2.使得数据结构的成员能够按某种次序排列,通过调用.next()方法，指向下一个成员3.是ES6创造了一种新的遍历命令for...of循环，Iterator接口

2021-09-27 18:56:14 71

原创 juery封装的ajax

1.后台接口的请求方式get/post2.后台接口的路径 url3.请求的参数数据格式4.请求头的设置5.响应数据的获取 $(function(){ //设置全局变量 $.ajaxSetup({ headers:{ 'Authorization':sessionStorage.getItem('token') } })

2021-09-27 16:51:18 62

原创 es6中的变量解构对象数组函数

一.变量/常量声明1.let 用于声明一个变量 1 变量不会提升,即在变量声明之前无法使用该变量 2.不可以重复声明 3.具有块级作用域，只在当前作用域有效2.const 用于声明一个常量1.变量声明不会被提升，即在变量声明之前无法使用该变量2.不允许重复声明。3.具有局部作用域，即const声明的变量只能在对应代码块中使用4.const声明的变量在声明的时候就需要赋值，并且只能赋值一次，不能修改。二.解构ES6 允许按照一定模式，从数组和对象中提取值，对变量进

2021-09-26 20:03:14 311

原创 es6模块化

一.ES6介绍ES6是ES2015、ES2016、ES2017他们的统称官方名字：《ECMAScript 2015 标准》=> ES6二.包管理机制（npm）npm init -y 初始化nodejs项目生成一个package.json文件，该文件中保存了项目所有相关信息1.全局依赖cnpm install xxx --global简写: cnpm i xxx -g2.局部依赖2.1产品依赖dependenciescnpm install xxx --save简写：cnpm

2021-09-26 16:03:23 66

原创拖放及存储技术

事件dragstart 按下鼠标按键并开始移动鼠标会触发dragstart事件我们通过ondragstart来调用方法drag 当dragstart开始会持续触发drag事件类似mousemove事件dragend 当拖放停止时（鼠标按键抬起时）会触发dragenter 拖动元素被拖动到放置元素上dragover 拖动元素在放置元素范围内移动dragleave拖动元素从放置元素上移出drop 放置事件拖放事件生命周期dragstart>drag&gt

2021-09-15 22:56:24 89

原创 canvas画布

简介：属于html元素 H5新元素需要结合js 用来绘制图形在页面上放置一个canvas元素就相当于放置了一块画布可以绘制路径矩形圆形字符图像…属性：width 默认值 300pxheight 默认值 150px注意点：canvas需要写闭合标签一般不建议使用css设置它的宽高方法： <canvas id="canvas" width="300" height="300"></canvas> <sctript> //

2021-09-15 22:49:00 127

原创 AJAX

AJAX即“Asynchronous Javascript And XML”（异步的JavaScript和XML），是指一种创建交互式网页应用的网页开发技术，用于浏览器和服务器之间进行数据交互。通过HTTP请求加载远程数据这里指的是jQuery对ajax的实现参数类型返回值参数urlString发送请求的地址typePOST、GET 默认值（GET）PUT DELETE也可以使用但是兼容性可能不太好部分浏览器支持optionsObject进行a

2021-09-14 11:34:32 90

原创 BOM--浏览器对象模型

BOM里的一个核心对象 windowjs是单线程的语言，但是我们可以通过超时调用或者间歇调用来调度代码超时调用setTimeout()作用：在指定的毫秒数（时间）后执行函数参数：两个参数要执行的函数（必须）以毫秒表示的时间（可选默认 0）返回值：是一个数字，是当前setTimeout的id，可以通过这个id取消执行clearTimeout()作用：取消某个超时调用参数：参数超时调用的id间歇调用setInterval()作用：在指定的毫秒数（时间）周期，重复调用函数直到

2021-09-12 20:48:09 69

原创 JQuery的使用

JQuery 是一个高效、精简并且功能丰富的第三方JavaScript 工具库，为我们封装了DOM操作，让我们操作dom节点更加方便。功能：HTML 元素选取HTML 元素操作CSS 操作HTML 事件函数JavaScript 特效和动画HTML DOM 遍历和修改AJAXUtilities使用：bootcdn 找到资源把链接引入到HTML文件里1.直接引入网络资源2.将网络资源下载到本地使用<head><script type="text/javasc

2021-09-10 15:03:30 181

原创 CSS选择器

1.id选择器#id属性值{}（id唯一）2.类选择器.class属性值{}class可重复使用，可以同时为一个元素指定多个class属性3.元素/标签选择器元素名{} 例：p{}，div{}，h1{}4. 普遍选择器表示选择所有元素通常用在组合选择器中*{} 选中页面中的所有元素#app>*{background-color: honeydew;}5. 层次选择器①子元素选择器：父元素>子元素②后代元素选择器祖先元素后代元素③兄弟元素选择器：选择紧挨

2021-09-07 14:43:37 206

原创云服务器的部署及Linux基础

1.安装Apache2apt-get update 更新apt-get install apache2 安装service apache2 status 检查是否在运行service apache2 start 开始运行2. 在filezilla上传自己的文件3. 开始部署：ssh root@ip公网地址输入密码——yesmv 上传的文件名 /var/www/htmlcd /var/www/htmllschmod -R 777 /var/www/html/文件名4.关闭云服

2021-09-06 16:31:32 155

原创 DOM节点操作以及DOM中的事件

DOM：全称Document Object Model 文档对象模型js操作html、xml文档的api1998年10月IE中的DOM对象是以COM对象的形式实现的节点：Node–构成HTML文档最基本的单元常用节点分为四类1.文档节点：整个HTML文档2.元素节点：HTML文档中的HTML标签3.属性节点：元素的属性4.文本节点：HTML标签中的文本内容节点的属性nodeNamenodeTypenodeValue文档节点#document9null

2021-09-06 15:26:46 567

原创 javaScript的三种继承

1.原型链继承每个构造函数都有一个原型对象，原型对象中都包含一个指向构造函数的指针，而实例都包含一个指向原型对象的内部指针。当原型对象等于另外一个类型的实例即继承。调用某个方法或者属性的步骤1.搜索实例2.搜索原型3.搜索父构造函数原型//定义父类类型function Animal(){this.name = “animal” }Animal.prototype = {sayName : function(){alert(this.name);}}// 定义父类类型functi

2021-09-04 21:32:09 60

原创工厂模式、构造函数模式、原型模式、组合模式

创建对象:对象的抽象与封装1.字面量创建产生大量重复代码2、工厂模式这种方式本质上是将创建对象的过程进行了封装，本质并没有改变。优点：通过将创建对象的方法封装起来，避免重复代码产生。缺点：1.创建出来的所有对象类型都是Object类型，没有办法知道对象到底是Person还是Dog2.封装性比较差，函数声明和工厂函数单独声明3.占用过多内存//工厂函数创建的对象，对象有自己的属性和方法 function newPerson(name,age,gender){ va

2021-09-04 18:19:51 114

原创数组基础总结

定义字面量：var arr=[];构造函数：var arr=new Array();任意数据类型，数组的长度可变可指定arr.length=6;赋值定义时赋值：var arr=[100,200,…];通过索引下标赋值：arr[0]=‘hello’;arr[3]=‘world’;var arr=new Array(10);//一个整型，新建指定长度的空数组var arr=new Array(10.1);//error 不允许传递一个浮点型的数据访问使用[]访问法，索引下标的使用lengt

2021-09-01 19:53:42 90

原创函数的基本语法

函数1.函数声明function 函数名(形参列表){函数体return写在return后面代码，除了var会变量提升，其他都会忽略}接收返回值结果var a=函数名(实参列表)2.函数表达式var 函数名（f1）=function(形参列表){//函数体}f1()3.函数提升f1();function f1(){console.log(‘我是一个函数’)}f1()1.函数的提升会放在作用域的最顶部2.有使用var声明得变量在函数提升之后进行变量提升3.var声明

2021-08-28 18:32:21 1488

原创对象与堆栈的描述

创建对象1、构造函数模式使用Object或者使用自定义构造函数来初始化对象(例如Student)var obj = new Object();obj.name = “terry”;//等价于 <==>var obj={};obj.name=“terry”;obj.age=12;2、字面量模式 {}var obj = {name:“terry”,age:12,sayName:function(){console.log("my name is ",this.name)

2021-08-26 18:03:51 167

原创数据类型转换

其他类型转Stringnumber ---> string +号拼接'' 两边如果都是基本数据类型就进行字符串的拼接 console.log(123); console.log(123+''); //'123'boolean ---> string +号拼接'' console.log(true +'') //'true'null --> string +号拼接''undefined --> string 'undefined'

2021-08-26 17:44:51 62

原创 JavaScript组成、基本数据类型及变量/函数提升

1.javascript是一门编程语言，允许用户在浏览器页面完成复杂得事情。2.javascript产生目的为了处理表单中用户填写一些无效信息而给后台服务器产生的压力3.javascript组成核心ECMAScript dom bom4.前端三要素三剑客html --木偶得各个部位轮廓素颜css–木偶的衣服化妆js – 控制木偶动起来5javascript特点1.客户端代码,在客户机上执行也可以在服务器端执行，需要搭建node环境2.解释型语言浏览器和或者

2021-08-23 18:43:15 67

原创 HTML背景

HTML(2021-8-03)基础知识什么是HTML？超文本标记语言1. 超文本：页面内包含的内容不仅仅是文本还可以包含图片、链接、音乐、视频等非文字元素。2. 标记语言：不是编程语言div

2021-08-21 20:15:09 36

原创浮动及css伸缩盒弹性布局

浮动固定搭配：因为要遵循盒子模型公式：margin-left+border-left+padding-left+content+padding-right+border-right+margin-right=父元素内容区大小float:left;margin-left: ;margin-top: ;float:right;margin-right: ;margin-bottom: ;块级元素独占一行空间，宽度默认为父级的100%，高度由其内容高度（子元素高度）所决定。行内元素与其

2021-08-21 20:12:33 432

原创第一阶段总结

前端方向第一阶段测试1、下列哪个是子代选择器p>b 子代p b 后代p+b 兄弟p.b 选中p的同时选中类名2、下述有关css属性position的属性值的描述，说法错误的是？static：没有定位，元素出现在正常的流中fixed：生成绝对定位的元素，相对于父元素进行定位relative：生成相对定位的元素，相对于元素本身正常位置进行定位absolute：生成绝对定位的元素，相对于 static 定位以外的第一个祖先元素进行定位3.元素的alt和title

2021-08-18 00:43:44 292

原创盒子模型简述

盒子模型盒子属性（ Box properties）文档中的每个元素都可以被看作是一个矩形盒子。width & height用于设置内容区的宽高，该片区域用于显示内容。盒子高度默认为内容的高度。padding 内间距代表内容盒子的外边界与外边框的内边界之间的距离border设定介于padding的外边缘与margin的内边缘之间，默认值为0margin 外边距代表盒子四周的区域。设值方法与padding类似。相邻元素的边距会合并。默认盒子模型-- W3C盒子使用

2021-08-10 19:41:05 79

原创 H5C3基础

HTML&CSS1.行内元素、块级元素是什么？有哪些？行内元素作用：在结构中填充网页内容特点：与其他行内元素共享一行空间宽高都有自身决定不用来搭建网页结构、也无需通过CSS指定宽高不可以嵌套块级元素span ：无意义的行内元素，CSS去修饰例子： a超链接 Href=”” 绝对路径、相对路径、锚点target=”” _self _blank img图片：width heightsrc 绝对路径、相对路径Alt 图片找不到后展示的文字信息装饰类型（逐步淘汰）：

2021-08-10 19:17:56 71

原创 HTML5(day2)

HTML: 超文本标记语言（英语：HyperText Markup Language，简称：HTML）是一种用于创建网页的标准标记语言。HTML5:HTML5是HTML最新的修订版本，2014年10月由万维网联盟（W3C）完成标准制定。HTML5的设计目的是为了在移动设备上支持多媒体。HTML5 简单易学。...

2021-08-02 19:33:15 68

原创 git操作

git的安装 git --version // 检测git版本 gitee 码云注册 github 创建仓库上传代码一个本地仓库和云端的git仓库只能一一对应1. 本地普通文件夹 -变成- git仓库本地仓库（普通文件夹）本地仓库（git仓库）: git init 操作执行后文件夹中多了 /.git 代表这是一个git仓库2. 本地git仓库 -连接- 云端git仓库本地：/...

2021-07-27 19:28:56 52

zy123r的博客