- 博客(51)
- 收藏
- 关注
RSS订阅原创 React入门-React的特点，React脚手架搭建工程
React的特点轻量：React的开发版所有源码（包含注释）仅3000多行原生：所有的React的代码都是用原生JS书写而成的，不依赖其他任何库易扩展：React对代码的封装程度较低，也没有过多的使用魔法，所以React中的很多功能都可以扩展。不依赖宿主环境：React只依赖原生JS语言，不依赖任何其他东西，包括运行环境。因此，它可以被轻松的移植到浏览器、桌面应用、移动端。渐近式：React并非框架，对整个工程没有强制约束力。这对与那些已存在的工程，可以逐步的将其改造为React，而不需要全盘重
2022-04-19 13:50:12
847
原创 elementui-plus+vue3+vite构建工具模板——路由配置
elementui-plue提供了 Vite 模板clone到本地后，执行npm i然后安装路由npm install vue-router在项目中创建views文件夹，并添加一个vue文件，这里名为hello.vue，并写一些简单的模板代码新建一个router文件，在router目录下新建index.js文件，如果不想把router路径写在这个文件下，还可以添加几个文件用来管理路径，再进行导出即可，这里先都写在index.js下，代码如下：import { createRouter,
2022-04-14 13:04:25
2073
1
原创 vue3升级部分（一）
之前一直是用vue2来写项目的，现在实习工作也不是很忙，闲下来记录一些vue2和vue3对比有哪些升级的部分。1. ref在vue2中的用法在vue2中，如果我们想要一个dom节点，需要以下两步：使用ref给元素注册引用信息；在方法中利用this.$refs.xxx便可获取该dom元素；//示例代码<template> <div> <ul> <li v-for="(item,index) in lis
2022-04-11 12:51:10
862
原创 vue3升级部分（二）-composion API
1. ref在vue2中的用法在vue2中，如果我们想要一个dom节点，需要以下两步：使用ref给元素注册引用信息，在方法中利用this.$refs.xxx便可获取该dom元素//示例代码<template> <div> <ul> <li v-for="(item,index) in list" :key="index" :ref="name">{{item.nam}}</li>
2022-04-06 08:36:04
446
原创 Electron入门
Electron**[electron 官网地址]：**https://www.electronjs.org/[electron github地址]：https://github.com/electron/electron-quick-start/tree/master作用Electron 是一个跨平台的、基于 Web 前端技术的桌面 GUI 应用程序开发框架。使用 Web 前端技术来开发一个桌面 GUI 程序是一件多么炫酷的事情，你可以使用 HTML、CSS 来绘制界面和控制布局，使用 Java
2022-02-07 13:11:35
2288
原创 从阿里巴巴icon引入图标到微信小程序（可以改变大小，颜色）
首先到阿里巴巴官方icon图标库选择自己喜欢的图标并且加入图购物车点击网站左上角的购物车按钮再点击添加至项目把文件解压以后我们需要这个iconfont.css文件，把他的后缀名改成.wxss后复制到我们自己的项目中我这里是新建了一个文件夹然后在app.wxss中引入@import ‘styles/iconfont.wxss’;这时候回到iconfont的购物者页面，把你刚刚生成的在线链接替换掉confont.wxss中的@font-face这时候在页面总就可以使用了，并且可以利用字
2021-08-01 19:43:01
1754
原创 phpstudy（8.1.1.3）中打开mySql立即闪退的解决办法
扎了网上的很多方法，比如更改端口，删除my.ini都没有用，最后用了下面的方法蔡成功解决，记录一下首先打开phpstudy，然后在找到控制面板总的管理工具的服务在这里插入图片描述在这里面找到mysql并停止运行就好了（我这里没有是因为已经删掉了）...
2021-07-06 08:58:54
1553
1
原创 mock.js的一些使用方法
前端工程师通常会使用mock来模拟一些数据，下面是它的一些用法具体的语法使用规则在官网地址中下面是一个在实际中应用的例子（demo）在表格中随机获取学生的学号，性别，年龄，邮箱结果展示代码 $('#btn').click(function () { //获取按钮键 $.ajax({ //ajax方法获取路径，必须和下面的mock所用路径一致 url:'js/json.js',
2021-07-03 10:58:54
168
原创 javascript 数组去重（利用对象的属性不允许重复）
今天偶然间学到一个可以利用对象的属性不允许重复的特性进行数组去重的方法，记录一下1.数组的原型链上挂载一个方法2.定义一个空对象和空数组3.循环遍历数组，this.length就是数组的长度4.if语句的意思是，拿1来举例，如果temp[arr[1]]不存在的话，那么把字符串a赋给temp[arr[1]]，那么由于temp已经有了1这个属性名，后面再遍历到1，就会被忽略，这样就可以实现对数组的去重啦<script> arr=[1,2,3,1,2,4,1,2,1,4] A
2021-05-10 18:59:54
1044
原创 利用原生JS进行一个简单的验证（正则表达式）
实现功能：当输入3-6个英文字母时，span标签显示成功，当输入其他元素时，显示失败代码如下<body><input type="text" name="user"><span></span> <script> document.querySelector('input').addEventListener('keyup',function () {
2021-04-25 19:28:58
196
原创 微任务和宏任务
同步>微任务>宏任务 setTimeout(()=>{ console.log('settimeout') //宏任务队列 }) new Promise(resolve => { resolve(); console.log('promise') //立即执行（同步） }).then(value => console.log('成功')) //微任务队列 console.log('同
2021-04-25 12:09:44
63
原创 then和catch是如何改变promise状态的
then 正常返回的时候，promise的状态是resolved，报错的时候， promise的状态是rejectedcatch正常返回的时候，promise的状态是resolved，报错的时候，promise的状态时rejectedresolved状态的promise会执行then里面的回调函数rejected状态的promise会执行catch里面的回调函数 <script>//then const a = Promise.resolve()
2021-04-24 12:34:30
322
原创 async await promise
执行async函数 ，返回的都是Promise对象若执行的是一个普通函数，那么async会帮你封装成一个promise对象在进行返回若直接返回一个promise对象，就会返回promise对象 async function test1() { return 1 } async function test2() { return Promise.resolve(2) } const a = test1() const b = te
2021-04-24 11:27:28
102
原创 Vue的兄弟组件传值
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <style> </style></
2021-04-24 09:56:50
79
原创 Vue的computed，directive，mount，refs，nexttick
ComputedDirectivemountrefsnexttick模板内虽然也可以进行计算，但函数用多了看起来就会很麻烦，所以我们使用computed属性computed具有缓存属性，计算属性必须是一个函数<div id="app"> {{msg}} <div v-for="i in new Array(10)"> {{msg2}}</div> <input type="button" value="btn" @click=
2021-04-13 19:43:17
235
原创 ImportError at /login/u doesn‘t look like a module path
在网上看了很多相关信息，都没有解决我自己的问题，从头到尾顺了一遍，觉得应该是新建的app的路径配置出了问题，然后就重新配置了一遍就解决了以下是解决步骤在解决问题之前，事先看看我们最后完成的文件结构目录吧1.新建一个testapp在下面的命令行输入startapp testapp然后在djangoproject的settings下配置注册我们刚刚建立的testapp2.配置相关路由在testapp下新建一个urls.py文件，然后输入以下代码from django.contrib impo
2021-03-27 08:40:13
406
原创 UnicodeDecodeError: ‘gbk‘ codec can‘t decode byte 0xa6 in position 9737: illegal multibyte sequence
UnicodeDecodeError: ‘gbk’ codec can’t decode byte 0xa6 in position 9737: illegal multibyte sequence打开django/views下的debug.py文件，转到line331行：with Path(CURRENT_DIR, ‘templates’, ‘technical_500.html’).open() as fh改成： with Path(CURRENT_DIR, ‘templates’, ‘te
2021-03-27 08:24:28
86
原创 Django：unsupported operand type(s) for /: ‘str‘ and ‘str
找到settings.py目录，将DIRS的/改为,即可运行
2021-03-26 19:49:45
267
1
原创 利用bootstrap和vue做的一个设备管理系统小demo（只有前端版）
一.主要功能利用Vue和bootstrap来实现一个设备管理系统，主要功能为：1.增加产品的信息（包括产品名称，产品价格，生产厂家和产品数量）2.删除某一条产品信息（在点击删除时会弹出警示框）3.点击全部删除按钮，会将已经录入的产品全部删除二.代码实现1.首先引入bootstrap中的框架，对整体进行布局（到官网直接引用后更改文字描述即可）2.设置添加按钮，绑定add()add(){ this.equipments.push(this.newEqu
2021-03-24 21:27:59
1115
原创 关于echarts的一些问题
BoudaryGap：在坐标轴的起始部分是否需要间隔，默认是有间隙，需要改为false才能实现无间隔grid:{ left:'3%', top: '35%', right:'4%', bottom:'1%' , containLabel:true },ContainLabel：在设置坐标轴外边距的时候是否包含文字，默认是不包含，需要将属性改为true才能实现包含文字xAxis:{ data:t{}, boundaryGap:false
2021-03-21 09:43:23
152
原创 关于vue中的一些错误总结
这是由于没有转到对应目录下，cd 创建的文件夹即可npm ERR! code ENOENTnpm ERR! syscall opennpm ERR! path E:\xxx\views\front\package.jsonnpm ERR! errno -4058npm ERR! enoent ENOENT: no such file or directory, open 'E:\xxx\views\front\package.json'npm ERR! enoent This is relate
2021-01-25 21:16:37
42
原创 在利用vue3创建项目时，怎么关闭eslint
在eslint的试用过程中，由于它对代码的检查，使得我们在练习过程中会有很多的麻烦最彻底的解决方法如下：在选择完Manually select features (手动配置)以后 Check the features needed for your project: (Press <space> to select, <a> to toggle all, <i> to invert selection) // 检查项目所需的功能:(按<space>选
2021-01-25 20:26:45
518
2
原创 关于normalize.css到底是干嘛的
首先先放上normalize.css的链接 传送门这是一个基本样式，能够帮助我们解决在我们没有编辑基本样式的时候各个浏览器默认情况的不匹配例如，a浏览器的默认情况下下划线的颜色是蓝色，而b浏览器的默认下划线的颜色的黑色，这个css文件就会把不一样的颜色转化为它里面已经编辑好的，让所有的浏览器上对于未定义的样式浏览效果达到一致。...
2021-01-20 13:04:30
525
原创 哔哩哔哩首页的对焦效果
css部分 <style> *{ margin: 0; padding: 0; } .container{ height: 160px; position: relative; overflow: hidden; } .container>.banner{ posit
2020-11-24 18:31:00
189
原创 vue小案例—记事本
css部分 *{ margin: 0; padding: 0; } .book{ display: flex; justify-content: center; align-content: center; } #todoapp{ width: 300px; border:.
2020-11-24 14:24:01
256
转载 scrollHeight,clientHeight,scrollTop
移动端加载数据时，由于数据太多，不会一次性全部加载出来。有些会采用pc端那样用分页码的形式，但是更多的确实滑动滚动条到内容最后，加载更多内容出来。一般引入了三方的前端框架和插件，基本都会有此功能。偶尔会需要采用原生js实现，故而此处就介绍下原生js的实现方式。另外附上jquery的实现方式。原生js实现思路需要三个高度：scrollHeight（文档内容实际高度，包括超出视窗的溢出部分）、scrollTop（滚动条滚动距离）、clientHeight（窗口可视范围高度）。当 clientHeig
2020-11-19 09:01:15
1298
原创 background-clip:text（把背景图片变成字体的颜色）
偶然发现background-clip除了教程上给出的那几个属性以外，还有这种特殊的玩法，就是让背景图片变成字体的颜色举个例子这里只要将background-color变成background-image文字的颜色就可以变成背景图片了css部分 body{ background-color: black; } h1{ background-color: #ff6242; -webkit-backgr
2020-11-19 08:20:28
793
1
原创 css3中vh和vw分别是什么意思？
1vw等于视口宽度（viewport width）的百分之一，也就是说100vw就是视口的宽度。同理，1vh等于视口高度（viewport height）的百分之一，100vh就是视口的高度
2020-11-18 22:22:20
6933
1
原创 BOM DOM的一些解释
DOM 是为了操作文档出现的 API，document 是其的一个对象；BOM 是为了操作浏览器出现的 API，window 是其的一个对象。BOM是浏览器对象模型，是对浏览器本身进行操作DOM是文档对象模型，是对浏览器（可看成容器）内的内容进行操作归DOM管的：E区（就是你说的document啦。由web开发人员呕心沥血写出来的一个文件夹，里面有index.html，CSS和JS什么鬼的，部署在服务器上，我们可以通过浏览器的地址栏输入URL然后回车将这个document加载到本地，浏览，右键查看
2020-11-11 11:15:34
204
原创 向DNS服务器查询web服务器的ip地址
前提在我们利用浏览器发送请求的时候，尽管浏览器可以解析网址并生成http信息，但它本身并不具备将消息发送到网络中的功能，此时，我们就要利用操作系统来完成这图一任务，但委托操作系统发送消息的时候，必须要提供ip地址。但由于ip地址的难以记忆，所以提供了这样一个机制能够通过ip地址来查询名称，这个机制就是DNS工作过程DNS服务器中的所有信息都是按照域名以分层次的结构来保存的（用句点分隔，例如：www.baidu.com中的.com就表示一个域.baidu也表示一个域，www表示服务器名称），每个域的信息
2020-11-06 12:20:32
574
原创 HTTP协议相关
HTTP就是超文本传输协议，着是一种通信息协议，允许将超文本标记语言（HTML）文档从web服务器传送到客户端一.TCP/IP HTTP是在TCP/CP协议上的，是TCP/IP的一个子集 TCP/IP协议是一系列与互联网相关联的协议集合起来的总称 传输层-tcp三次握手 使用TCP 协议进行通信的双方必须要先进行连接，然后才能传输数据。为了确保连接双方的可靠性，在双方建立连接的时候，TCP 协议采用了三次握手策略 1.客户端发送SYN包到服务端，创建一个连接 2.服务端收到
2020-11-05 17:40:12
107
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人