web前端定做-CSDN博客

原创 mysql命令用法: select查询、insert into插入、updata修改、delete删除、排序

select查询insert into 插入updata 修改delete 删除

2022-01-20 14:56:09 1763

原创 router路由、二级路由、默认路由路径、查询参数、传参

$route:路由信息对象，只读对象；$router:路由操作对象，只写对象。完整路径：window.location.href路由路径：this.$route.path默认路由方法1：使用redirect 重定向默认路由。默认跳转到子路由 “/left/tab1”export default new Router({ routes: [{ path: "/", redirect: "/left" }, { path: "/left", component:

2021-12-17 08:29:26 3553

转载详解vue2.6插槽更新v-slot用法总结

在 2.6.0 中，我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即 v-slot 指令)。这篇文章主要介绍了详解vue2.6插槽更新v-slot用法总结，具有一定的参考价值，感兴趣的小伙伴们可以参考一下在 2.6.0 中，我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即 v-slot 指令)。它取代了 slot 和 slot-scope 这两个目前已被废弃但未被移除且仍在文档中的特性。新语法的由来可查阅 RFC。插槽我的理解就是父页面在组件标签内插入任意内容,子组件内插糟slot控制

2021-12-12 16:19:27 685

原创 $emit传递多个参数的方法

$emit传递多个参数时子组件：this.$emit('closeChange',false,true)。父组件：<posilCom @closeChange="closeCom(arguments)">//自动组成：数组形式closeCom(msg)｛ this.msg1 = msg[0]; this.msg2 = msg[1]｝

2021-12-09 11:10:20 8015 2

转载 js中的Promise详解

一概述Promise是异步编程的一种解决方案，可以替代传统的解决方案–回调函数和事件。ES6统一了用法，并原生提供了Promise对象。作为对象，Promise有一下两个特点： * （1）对象的状态不受外界影响。 * （2）一旦状态改变了就不会在变，也就是说任何时候Promise都只有一种状态。二 Promise的状态Promise有三种状态，分别是：**Pending **（进行中）， ** Resolved (已完成)， Rejected ** (已失败)。Promise从Pending状态开始

2021-11-30 02:26:24 4386 1

原创 for...in、for...of、forEach、some、every、filter、reduce 数组遍历的几种方法

for…in - 语句遍历对象的枚举的属性，以任意顺序for…of - 语句遍历可迭代对象定义要遍历的数据，可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句。for…inlet list = [{ name: "张三", age: 10 }, { name: "李四", age: 20 }, { name: "赵五", age: 30 }]for (index in

2021-11-26 20:16:47 667

原创 $nextTick延迟执行：在下次 DOM 更新循环结束之后执行延迟回调

定义：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。所以就衍生出了这个获取更新后的DOM的Vue方法。所以放在Vue.nextTick()回调函数中的执行的应该是会对DOM进行操作的 js代码；理解：nextTick()，是将回调函数延迟在下一次dom更新数据后调用，简单的理解是：当数据更新了，在dom中渲染后，自动执行该函数，例子:点击按钮,自动显示输入框,隐藏按钮.输入框获取焦点.输入框失去焦点,自动显示按钮.app.vue父组件&l

2021-11-25 18:41:36 813

原创 vue兄弟组件之间传值通讯

让兄弟组件通过一个共同的父组件彼此通讯。父组件：<template> <div id="app"> <div id=""> <h3>{{Adata}}</h3> <left @leftFun="leftFun"></left>  <right :Amsg="Adata"></right

2021-11-25 14:24:04 584

转载 Vue 深度作用选择器 /deep/穿透与scoped

使用 scoped 后，父组件的样式将不会渗透到子组件中。<template> <div id="app"> <el-input class="text-box" v-model="text"></el-input> </div></template><script>export default { name: 'App', data() { return { text

2021-11-23 21:23:03 1927

转载 vue-axios|axios 在vue cli的创建例子

安装:npm install --save axios vue-axios将下面代码加入入口文件:import Vue from 'vue'import axios from 'axios'import VueAxios from 'vue-axios'Vue.use(VueAxios, axios)↑按照这个顺序分别引入这三个文件： vue, axios and vue-axiosUsage:This wrapper bind axios to Vue or this if you

2021-11-21 23:52:01 132

转载 Vue 组件化中 data为什么是函数，return{}？

前言我们需要先复习下原型链的知识，其实这个问题取决于 js ，而并非是 vue 。function Component(){ this.data = this.data}Component.prototype.data = { name:'jack', age:22,}首先我们达成一个共识（没有这个共识，请补充下 js 原型链部分的知识）：实例它们构造函数内的this内容是不一样的。Component.prototype ，这类底下的方法或者值，都是所有实例公用的。解开疑问基

2021-11-12 14:43:42 279

转载 js ( =＞ ) 箭头函数

是ES6标准新增的函数x => x*x///相当于function (x) { return x*x;}箭头函数只包含一个表达式时，{ … } 和 return 都可以省略掉；但当包含多条语句时，就不能省掉了。如果参数不止一个，就需要用括号（）括起来：(x, y) => x*x + y*y;() => 1002;(x, y, ...) => { var i, sum = x + y; for(i = 0; i < arrays

2021-08-13 14:31:14 165

转载 VUE 注册全局组件

Vue注册全局组件的步骤(1) 写组件(2)定义组件的名称和数据(3)在main.js中引入(4)Vue.component(“my-bread”, MyBread);注册1==》新建文件夹(cuscom) 组件的文件(myBread.vue)在myBread.vue文件如下{ <template> <el-breadcrumb separator="/"> <el-breadcrumb-item :to=

2021-08-05 01:42:25 198

转载 js中proto和prototype的区别和关系？

1.在JS里，万物皆对象。方法（Function）是对象，方法的原型(Function.prototype)是对象。因此，它们都会具有对象共有的特点。即：对象具有属性__proto__，可称为隐式原型，一个对象的隐式原型指向构造该对象的构造函数的原型，这也保证了实例能够访问在构造函数原型中定义的属性和方法。2.方法(Function)方法这个特殊的对象，除了和其他对象一样有上述_proto_属性之外，还有自己特有的属性——原型属性（prototype），这个属性是一个指针，指向一个对象，这个对象的用途

2021-07-26 13:27:34 141

转载漫谈JS中的prototype，用月饼厂添加工艺，汉字代码通俗解读

1. 引言继承(inheritance)、封装(encapsulation)和多态(polymorphism)是面向对象机制的主要特性。在JS中没有“class”的概念，自然也无法直接进行JAVA、C常用到的extends、implements等操作。但从某种意义上来说，JS是纯粹的“面向对象”编程语言，因为JS中处处皆是对象(函数也是对象)，而且作为函数式脚本语言，天生就是多态的。网上很多文章探讨JS中如何设计class和面向对象机制，这些文章的思路聚焦于如何严格按照JAVA、C中面向对象的实现机

2021-07-21 00:47:43 152

转载帮你彻底搞懂JS中的prototype、proto与constructor（图解）

1. 前言作为一名前端工程师，必须搞懂JS中的prototype、__proto__与constructor属性，相信很多初学者对这些属性存在许多困惑，容易把它们混淆，本文旨在帮助大家理清它们之间的关系并彻底搞懂它们。这里说明一点，__proto__属性的两边是各由两个下划线构成（这里为了方便大家看清，在两下划线之间加入了一个空格：_ _proto_ _，读作“dunder proto”，“double underscore proto”的缩写），实际上，该属性在ES标准定义中的名字应该是[[Pro

2021-07-20 15:27:34 221

转载 js prototype 原型对象

每个函数都有一个prototype属性，这个属性是指向一个对象的引用，这个对象称为原型对象，原型对象包含函数实例共享的方法和属性用过JavaScript的同学们肯定都对prototype如雷贯耳，但是这究竟是个什么东西却让初学者莫衷一是，只知道函数都会有一个prototype属性，可以为其添加函数供实例访问，其它的就不清楚了，最近看了一些 JavaScript高级程序设计，终于揭开了其神秘面纱。每个函数都有一个prototype属性，这个属性是指向一个对象的引用，这个对象称为原型对象，原型对象包含函

2021-07-20 14:58:37 174

转载 js call

call 方法调用一个对象的一个方法，以另一个对象替换当前对象。call([thisObj [,arg1[, arg2[, [,.argN]]]]])参数thisObj：可选项。将被用作当前对象的对象。arg1, arg2, , argN：可选项。将被传递方法参数序列。call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。如果没有提供 thisObj 参数，那么 Global 对象被用作 thisObj。

2021-07-20 14:27:12 183

原创 javascript回调函数详解

2021-07-20 14:20:48 8320

原创 var、let 定义变量区别

var a = 5;var b = 10; if (a === 5) { let a = 4; // if 块级作用域 var b = 1; // 函数级作用域，这里是if块，非函数 console.log(a); // 4 console.log(b); // 1} console.log(a); // 5console.log(b); // 1var声明的变量是函数级的或者是全局的，而let用于声明块级作用域。在函数或程序顶层使用时，let与var没有什么区别

2021-07-20 14:20:39 77

原创 let与var在for循环体内作用域。使用setTimeout（）函数

var与letsetTimeout()使用var在for中定义因为var在此定义的作用域是在函数内 (这里的 i 是函数局部变量)，每一次循环的 i 是同一个 i又因为setTimeout()函数与其内部的函数是异步执行的，即setTimeout（）执行时，内部的函数（下图中timer()）也在执行，for函数执行完毕，但1s还没到，此时等待执行的函数是console.log（i） console.log（i） console.log（i） console.log（i） console.log（i

2021-07-20 14:19:59 224

原创子元素在父元素中定位：居中显示

水平居中（margin:0 auto;）关于这个，大家应该是最不陌生的,不管是在培训班还是自己自学的话。这个应该是老师讲的第一个方法了（水平方向上），但是其有一个前提，就是被包裹的元素不能有浮动的属性。否则的话这个属性就会失效。具体如下图代码：<style> body{margin: 0;} .box{ width: 400px; height: 400px; border:1px so

2021-07-19 14:05:27 344

转载关于overflow:hidden的作用（溢出隐藏、清除浮动、解决外边距塌陷等等）

overflow 属性: 规定当内容溢出元素框时发生的事情。一. overflow:hidden 溢出隐藏给一个元素中设置overflow:hidden，那么该元素的内容若超出了给定的宽度和高度属性，那么超出的部分将会被隐藏，不占位。/*css样式*/<style type="text/css"> div{ width: 150px; height: 60px; background: skyblue; overflow: hidden; /*溢出隐藏*/

2021-07-19 14:04:31 891

原创实现播放遮罩：css中的显示与隐藏，通过定位position【子绝父相】

点击前画面：鼠标移动进来的画面：素材： * { margin: 0; padding: 0; } .box { position: relative; height: 225px; width: 400px; background-color: #00FF00; margin: 20px auto; } img { width: 100%; } #zheZhao{ displa

2021-07-19 14:02:52 164

原创 vuex表单处理：input绑定state数据的方法(v-model优化)

在输入框打字,标签"结果:"就更新显示[输入框里面的内容]构建store://store/index.jsimport Vue from 'vue'import Vuex from "vuex"Vue.use(Vuex)const store = new Vuex.Store({ state: { count: 0, }, mutations: { add(state,num) { state.count=num } },})export default .

2021-07-19 14:01:30 1022 1

转载 Vuex：state,mapState,...mapState对象展开符详解

1.statestate是什么?定义:state(vuex) ≈ data (vue)vuex的state和vue的data有很多相似之处,都是用于存储一些数据,或者说状态值.这些值都将被挂载数据和dom的双向绑定事件,也就是当你改变值的时候可以触发dom的更新.虽然state和data有很多相似之处,但state在使用的时候一般被挂载到子组件的computed计算属性上,这样有利于state的值发生改变的时候及时响应给子组件.如果你用data去接收$store.state,当然可以接收到值,但由

2021-07-19 13:58:57 323