- 博客(44)
- 收藏
- 关注
原创 10swiper库在vue中的使用
swiper库在vue中的使用网址:https://swiper.com.cn/基本使用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</tit..
2021-09-03 11:16:34
962
原创 11-vue生命周期函数
生命周期函数每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不同阶段添加自己的代码的机会。比如 created 钩子可以用来在一个实例被创建之后执行代码:new Vue({ data: { a: 1 }, created: function () { // `this` 指向 vm 实例 console.l
2021-09-03 11:14:15
144
原创 09-vue组件化开发
组件化开发什么是组件化:将一个功能实现的表现,结构,行为作一个整体来封装,形成一个组件,达到整体效果复用的目的。Vue组件的注册方式:根组件:当前我们在开始使用vue的时候,就创建了一个组件,new Vue()实例化的过程 ,就是创建了一个vue的根组件,运行new Vue的文件就是vue项目中的根组件。注册组件(自定义组件)<div id="box"> <!-- 使用组件navbar --> <navbar></na
2021-09-03 09:38:10
204
原创 08-fetch和axios
fetch和axiosFetch APIw3c规范中的Fetch API提供了一个 JavaScript 接口用于访问和操作HTTP管道的零件,如请求和响应。它还提供了一种全局fetch()方法,可以提供一种简单,合理的方式在网络上异步获取资源。此类功能以前是使用 XMLHttpRequest 实现的。Fetch提供了一个更好的替代方法,可以很容易地被其他技术使用,如Service Workers。Fetch还提供了一个单一的逻辑位置来定义其他HTTP相关的概念,如CORS和HTTP的扩展。请注
2021-09-02 14:56:15
153
原创 07-vue中的mixins混入
Mixins混入(Mixins)是一种分发Vue组件中可利用功能的非常灵活的方式,混入对象可以包含任意组件选项。当一个组件使用混入对象时,所有混入对象的选项将被混入该组件本身的选项,并且vue原本的选项不会被覆盖,如果出现同名属性,vue优先访问内部属性简单理解:就是将一串外部的代码引入到当前的Vue程序中使用。目的是提高代码的复用性 <div id="box"> <button @click="handleClick1">click1</button>
2021-09-02 08:55:03
87
原创 06-vue中计算属性computed及监听属性watch
计算属性及watch监听属性计算属性先看一个案例:动态渲染一个字母串,显示在页面时需要首字母大写,而从服务器请求回来的不一定会是首字母大写的情况,所以需要手动在前端作好处理。 <div id="box"> <!-- 将首字母大写,这里需要在页面中处理,这样的方式将业务逻辑写在了页面,会影响页面的可读性,这样的方式是不可取的。 --> {{myName.substr(0,1).toUpperCase() + myName.substr
2021-09-02 08:36:09
532
原创 05-vue表单绑定与购物车实例
vue表单绑定与购物车实例1.1 v-model在复选框中的使用在复选框中使用v-model指令,一般会作用在一个数组上。<div id="box"> <!-- v-model="checkArray": checkArray:为数组,所有选中的checkbox的value都会添加到数组中,取消选中时会自动从数组中删除该value。 注意:这里一定要给checkbox添加上value属性 --> <input type=
2021-09-01 16:19:26
315
原创 04-vue的事件处理器
vue事件处理器1.1 @click=“handleClick”不加小括号的事件处理方式,vue会自动传递事件对象,可以在事件处理函数中获取事件对象,但是无法传递自定义的参数 <div id="box"> {{count}} <br> <button @click="handleClick">事件处理-自动传递事件对象-无法传递参数</button> </div> <script> va
2021-09-01 15:08:09
289
原创 03-深入了解vue指令
一、指令的深入学习1.1 class类切换的对象写法 <div id="box"> <!-- 执行结果如下 <div class="aa bb cc"></div> --> <div :class="classObj"></div> </div> <script> var
2021-09-01 11:23:22
284
原创 02-vue常用指令的基本使用
一、Vue常用指令的基本使用:1.1 v-on指令绑定事件:v-on:事件=“事件处理程序”1.2 @符号简写方式绑定事件:@+事件(如:@click)往后的程序中常用简写方式来实现事件的绑定【说明】以上案例使用的@click来实现一个元素单击事件的绑定,往后所有事件都可以使用“@+事件”这样的方式来绑定一个事件,事件的实现简单而快捷。1.3 v-show显示或隐藏指令:根据条件显示或隐藏元素,元素始终会被渲染并保留在 DOM 中。v-show 只是简单地使用display切换元素的none或
2021-09-01 11:15:51
171
原创 01-vue简介及起步
目录vue简介及起步网址Vue是什么安装起步架构模式vue简介及起步网址https://cn.vuejs.org/v2/guide/Vue是什么Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。【注】Vue 不支持 IE8 以
2021-09-01 10:13:06
243
原创 vue项目写的样式应用不到元素上?elementUI等框架的坑
vue项目写的样式应用不到元素上?scoped原理接着坑就来了解决方法1、修改父元素的样式2、深度作用选择器使用vue+elementUI写个项目时发现写的样式应用不到元素上,任凭!important也毫无作用!看看你是否也踩了这个坑吧!scoped原理我们都知道style标签添加scoped属性时,里面写的样式代码只会作用到当前的模板(template)上,这样的好处是可以避免全局污染。原理是scoped属性会让当前模板上的标签添加自定义的属性并且style中的样式都会添加属性选择器对当前元素
2021-08-23 21:05:22
870
原创 手把手教你手撕ajax
ajax详解1.原生ajax1.1 ajax是什么?1.2 ajax作用是什么?1.3 ajax创建请求步骤1.4 ajax get和post请求的区别2.封装ajax使用 Ajax,我们可以无刷新状态更新页面,并且实现异步提交,提升了用户体验。.1.原生ajax1.1 ajax是什么? Ajax的核心是JavaScript对象XmlHttpRequest,XmlHttpRequest使您可以使用 JavaScript向服务器提出请求并处理响应,而不阻塞用户。
2021-07-20 22:44:08
319
原创 表妹又来问JavaScript的闭包啦,这就给你把来龙去脉讲清楚
文章目录什么是闭包1. 闭包形成的原理2. 闭包解决的问题3 闭包带来的问题4 闭包的应用4.1模仿块级作用域4.2埋点计数器4.2柯里化什么是闭包闭包是指有权访问另一个函数作用域中的变量的函数。函数中的name,test1不会被垃圾回收机制回收,直到页面关闭function myName() { let test1 = 1 let test2 = 2 let name = 'agul' let foo = { getName: function
2021-07-16 19:38:59
251
原创 师妹又问JavaScript中数据的深浅拷贝方法,这次给她安排上咯!
JavaScript中数据的深浅拷贝师妹啊,咱们在讲深浅拷贝之前我们先要明白javascript中数据的赋值是如何存储的,接下来再介绍深浅拷贝的方法,看好哦。赋值:简单数据类型直接在栈中开辟一块新的内存,存储赋值的数据;引用数据类型,在栈中开辟一块空间,存储赋值的数据对应的堆中的存储地址,源数据和拷贝的新数据对应的是同一块堆空间中的数据浅拷贝:堆栈各开辟一块新空间,栈中存储堆中新开辟的空间的地址,堆中赋值了源数据的数据,如果值是基本数据类型那么新数据和源数据没有任何关系,如果值是引用数据类型那么新
2021-07-15 23:47:03
101
2
原创 妹妹老问JavaScript判断数据类型的方法,哥一次给你回答的明明白白!
判断数据类型的几种方法话不多说,直奔正题。1. typeof(常用于判断基本数据类型,对于引用数据类型全部返回Object)语法: typeof [检测数据] 返回数据的类型名称特点对于基本类型,除 null 以外,均可以返回正确的结果。对于引用类型,除 function 以外,一律返回 object 类型。对于 null ,返回 object 类型。对于 function 返回 function 类型。 var str = '字符串类型';
2021-07-15 00:02:47
210
4
转载 移动端布局之postcss-px-to-viewport(兼容vant)
百分比布局转载:移动端布局之postcss-px-to-viewport(兼容vant)
2021-06-27 17:11:40
401
原创 手把手教你调用接口写个天气预报
前言作为前端开发人员,学过前后端交互的Ajax之后,来找个调用网上免费api 的项目做做、练练手吧!让你的作品美观的同时实现有趣又实用的功能!所用api天气 http://wthrcdn.etouch.cn/weather_mini?city=城市名称获取当前ip http://pv.sohu.com/cityjson?ie=utf-8根据ip获取所在城市 http://api.map.baidu.com/location/ip?ak=“你的百度ak”&ip=${ip}&a
2021-06-14 00:37:07
2146
1
原创 TinywebDB+MQTT实现掌控板抢答实验
TinywebDB+MQTT实现掌控板抢答实验一、实验目的及要求二、实验原理与内容三、实验软硬件环境四、实验过程1、TinywebDB实现云数据库出题2、MQTT实现多端同步通讯3、Mind+按键抢答和判题图形化程序五、实验结果六、总结一、实验目的及要求实现掌控板抢答器功能。二、实验原理与内容基于TinywebDB实现云数据库出题基于掌控板实现按键抢答和判题基于MQTT实现多端同步通讯三、实验软硬件环境硬件:掌控板软件:Mind+四、实验过程1、TinywebDB实现云数据库出题
2021-06-13 20:54:57
690
原创 来动手实现响应式web+mqtt应用!
前言使用掌控板和SIoT平台结合,实现一个响应式Web对接物联网MQTT的应用。此处实现的是控制灯的网站应用。软硬件软件:Mind+web编辑器+SIoT V1.3硬件:掌控板过程1、 制作SIoT插件修改SIoT1.3/static下的html文件以及modules下的Light_Ctrl.js,详细修改内容请参考博客下方的源码文件。SIoT默认的账号密码是“siot”、“dfrobot”,端口我修改为8089,部署SIoT的具体操作可以参考本人以往博客。启动SIoT,输入“电脑I
2021-06-13 20:01:31
486
2
原创 ajax+node.js玩转注册与登录
需求使用node.js搭建本地服务器,使用ajax进行请求和获取数据,功能是实现用户登录与注册功能。结构server.js为搭建服务器的文件,data.json存储的是用户信息,index.html和register.html分别为登录和注册页面写服务接口创建server.js文件,编写服务端代码,使用express框架搭建本地服务器,创建三个路由分别监听登录方式的get方法和post方法,以及注册功能get方法。const express = require('express')con
2021-06-08 09:29:46
587
原创 仿慕课网页面制作
仿慕课网页面制作本次项目是制作仿慕课网imooc的静态页面制作,记录所用到的知识。首页登录验证我这里使用了html5的表单验证,input标签里有一个属性pattern可以验证是否匹配对应的正则表达式:<form action=""> <div class="zh"> <div class="inputItem"> <input type="text" required
2021-06-02 21:01:23
2653
3
原创 sIoT及安卓app实现mqtt实验
实验目的实现sIoT配置并实现sIoT上mqtt消息的通讯。实验原理与内容sIoT可以在局域网上实现mqtt消息的通讯。借助sIoT可以通过手机app实现局域网内的设备操控。实验软硬件环境硬件:掌控板软件:Mind+ SIoT1.3实验过程首先将电脑和掌控板同时连接到实验室的wifi,在同一wifi环境下才能进行实验。在Windows用管理员身份打开cmd并输入命令netstat -abon查看本机端口使用情况。打开IoT1.3目录下的json文件其中端口不能与本机正在使用的端
2021-04-27 22:00:23
342
原创 Easy IoT实现mqtt实验
实验目的与要求实现Easy IoT配置。实现Easy IoT上mqtt消息的通讯。实验原理与内容实现mind+下Easy IoT上mqtt消息的通讯实验软硬件环境硬件:掌控板软件:Mind+实验过程(实验步骤、记录、数据、分析)在easy iot平台上注册账号登录Easy loT平台,点击工作间并创建两个设备打开Mind+软件,切换到上传模式,并在扩展中选择ESP32主控板,MQTT,WIFI网络服务。将电脑与ESP32掌控板连接后,进行程序的编辑。/*! * Mind
2021-04-14 11:08:16
305
1
原创 Sass——从入门到精通
Introduction to the SassSass,英文全称“Syntactically Awesome StyleSheets”,是对 CSS 的扩展。它添加了一些 CSS 语法不具有的新特性。Sass 让开发者维护样式表变得更简单。Sass 完全兼容 CSS,因为它是一个预处理器。它用 Sass 语法写代码,然后转换成标准的 CSS。它允许你使用变量、嵌套规则、导入等众多功能。有助于保持大型样式表结构良好,让 CSS 语言更强大,优雅。Sass 有两种语法。第一种被称为 SCSS(Sassy
2021-03-30 10:23:31
224
1
原创 asp.net中cs不存在控件名称,design.cs不能同步声明控件
解决问题描述使用asp.net开发网站时,拖动添加控件到设计界面时,在cs代码文件中使用控件对应的id进行逻辑编码时vs提示当前上下文不存在控件xx。经过仔细debug发现是因为该页面对应的design.cs未添加新控件的声明,自然而然就像页面的小三一样。。不能摆到明面上。。问题发现了,一开始以为是vs的bug,重启解决方案,重启vs,甚至重启电脑,发现都无用,但是此时,我发现至始至终`design.cs文件中只有一个datalist控件是声明了的,这让我怀疑,这玩意儿怎么就能没事儿发生一样呢?
2020-11-14 08:37:17
541
2
原创 C#如何给整型数组去重?如何排序?
C# 整型数组去重和排序方法C#中独特的数组语法真的让我感到脑阔疼。。记录一下这奇怪的用法,数组与泛型list搭配食用更佳哦~数组的去重:先将数组num转换成泛型list,再使用泛型方法Distinct()去重 List<int> list = num.ToList(); List<int> newList = list.Distinct().ToList(); //返回去重后的list数组排序数组排序只需要使用Array.Sort()方法即可,默认是升序
2020-08-20 11:32:04
1134
1
原创 fcc算法中级——最详细题解
fcc算法中级范围内的数字求和给出一个含有两个数字的数组,我们需要写一个函数,让它返回这两个数字间所有数字(包含这两个数字)的总和。注意,较小数不一定总是出现在数组的第一个元素。水体,比较两个临界值的大小,再循环相加即可function sumAll(arr) { if(arr[0] > arr[1]){ let temp = arr[0] arr[0] = arr[1] arr[1] = temp } let sum = 0; for(var i
2020-08-19 20:45:20
621
原创 LeetCode 002 两数相加 JavaScript版
题目:给出两个 非空 的链表用来表示两个非负的整数。其中,它们各自的位数是按照 逆序 的方式存储的,并且它们的每个节点只能存储 一位 数字。如果,我们将这两个数相加起来,则会返回一个新的链表来表示它们的和。您可以假设除了数字 0 之外,这两个数都不会以 0 开头。来源:力扣(LeetCode)输入:(2 -> 4 -> 3) + (5 -> 6 -> 4)输出:7 -> 0 -> 8原因:342 + 465 = 807思路: 首先理解题意是让两个链
2020-08-19 00:22:14
197
1
原创 C#如何给数组动态添加元素?如何“push“?
应用场景:需要向数组中循环插入元素,但C#中的数组是没有其他语言的push语法,是不支持动态添加元素的,C#只能创建固定大小的数组,该如何解决呢?个人觉得比较好的解决方法:使用泛型list< T >,先将元素存入list中,最后使用ToArray()转成数组。下面以读取一行数据,动态添加到整型数组中为例:获取元素,初始化泛型 // 读取一行数据给字符串line string line = Console.ReadLine(); // 将字符串以空格分割,存进字符串数组v
2020-08-18 09:12:41
5567
1
原创 asp.net 子页调用母版页的属性和控件
asp.net 子页调用母版页的属性和控件子页放置内容的容器:<asp:content id="content1" contentPlaceHolder="ContentPlaceHolder1" runat="server"><!--放置填充的内容--></asp:content>1)调用母版中的方法及属性:在子页声明被母版页信息,然后直接用master.XXX()调用。2)调用母版中的控件:在子页中通过FindControl搜索母版页的id,调用之。母
2020-07-02 07:35:59
993
原创 静态路由连通两个不同网络的pc(思科模拟器)
静态路由静态路由是路由器中的路由记录生成技术之一。即由网络管理员根据网络拓扑结构和网络通信需求,手工修改路由表中相关的路由记录。配置方法在路由器中,配置静态路由的方法有两种,在这里我只讲一种:ip route 目标网络 子网掩码 下一跳例如:RA(config)# ip route 192.168.1.0 255.255.255.0 192.168.3.1该命令执行后,路由器RA会生成一条到达网络192.168.1.0/24的路由记录。若要将数据包发送到网络192.168.1.0/2.
2020-06-07 14:39:23
7843
原创 http协议和Node.js异步编程
Node.js 创建Web服务器创建文件app.js // 引用系统模块http const http = require('http'); // 创建web服务器 const app = http.createServer(); // 当客户端发送请求的时候 app.on('request', (req, res) => { // 响应 res.end('<h1>hi, user</h1>'); }); // 监听30
2020-05-21 15:50:54
429
1
原创 Node.js入门基础指导教程
Node.js 基础1.1 为什么学习Node.js ?最简单最直接的一点,岗位需要这种技能能够和后端程序员更加紧密的配合网站业务逻辑前置,学习前端技术需要后端技术支撑扩宽知识视野,能够站在更高的角度审视整个项目1.2 服务器端需要做的事实现网站的业务逻辑实现数据的增删改查1.3 Node的好处使用JavaScript语法开发后端应用一些公司要求前端工程师掌握Node开发生态系统活跃,有大量开源库可以使用前端开发工具大多基于Node开发1.4 Node
2020-05-21 15:45:47
389
原创 apache添加虚拟主机的方法
转::配置虚拟主机配置了虚拟主机之后,想要添加更多的虚拟主机,方法很简单:1、修改httpd-vhosts-conf文件,添加<VirtualHost *:80> DocumentRoot "D:/agul/www/site0/" ServerName www.agulpicture.com ErrorLog "logs/agulpicture.com-error.log" CustomLog "logs/agulpicture.com-access.log
2020-05-13 16:26:52
247
原创 解决:apache搭配php,配置出现403错误
在apache的站点目录下写好php文件,访问时报错:403Forbidden You don’t have permission to access this resource.报错权限不够,网上都回复什么给Apache的httpd.conf文件中的Directory编辑为:<Directory /> XXX XXXX XXX</Directory>重启apache,依然报错。我们的问题的确与这个无关。重点来啦此时需要编辑虚拟主机的文件httpd-vhosts
2020-05-13 15:49:41
2248
原创 快速学习jQuery宝典来啦!
jQueryjQuery简介JavaScript库的概念JavaScript开发的过程中,处理浏览器的兼容很复杂而且很耗时,于是一些封装了这些操作的库应运而生。这些库还会把一些常用的代码进行封装。把一些常用到的方法写到一个单独的js文件,使用的时候直接去引用这js文件就可以了。(animate.js、common.js)常见的JavaScript 库 - jQuery、Prototype、MooTools。其中jQuery是最常用的一个jQuery其实就是一个js文件,里面封装了一大堆的方法方便
2020-05-10 22:04:42
524
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人