- 博客(47)
- 收藏
- 关注
原创 electron+vue项目使用serialport报错Cannot read property ‘indexOf‘ of undefined解决办法
使用Electron+Vue项目时引入serialport串口后启动时报下面错误。
2024-01-15 10:42:26
950
1
原创 前端对接电子秤、扫码枪设备serialPort 串口使用教程
SerialPort 是一个用于在 Node.js 环境中进行串口通信的库。它允许开发者通过 JavaScript 或 TypeScript 代码与计算机上的串口设备进行交互。SerialPort 库提供了丰富的 API,使得在串口通信中能够方便地进行设置、监听和发送数据。
2024-01-14 21:42:21
3311
原创 如何查看串口号和波特率?
serialport引入后,设备也接上了,一直不知道串口号和波特率去哪里找,当时这个问题困扰了我很久。获取到的ports是一个数组,包含当前电脑上所有的串口,其中的。还有一个方法也可以查看到串口号,但是看不到波特率,就是使用。
2024-01-14 21:28:44
12695
原创 【已解决】Vue3使用Element-plus按需加载时消息弹框ElMessage没有样式
Element-plus在使用ElMessage消息弹框的时候没有样式,按照官方的按需加载的方式引入的。
2023-06-22 22:10:44
5263
3
原创 TypeScript基础
定义函数、接口和类的时候,在名称后面加上< >来定义泛型,< >里面加上泛型的名称// 泛型// 定义函数、接口和类的时候不指定类型,使用的时候再定义类型return arg// 根据传入的类型决定返回的类型// res等于number类型的123// res2等于string类型的123创建了一个名称为T的泛型,「T到底是什么类型不知道,可能是任何一种,具体是什么要看使用时传入的类型。arg: T 使用泛型T作为入参的类型将泛型T作为函数返回值定义多个泛型// 定义多个泛型。
2023-05-27 19:08:34
2815
3
原创 Vue响应式进阶
和shallowRef()方法作用一样,shallowReactive()也是监听第一层数据,不一样的是数据是reactive数据,不是ref数据。track和trigger两个函数的作用就是将数据变成响应式,触发其他的方法,比如只有触发了track和trigger两个函数组件才会重新渲染,页面数据才会变。shallowRef()和triggerRef()是一对死对头,前者是深层数据改变的时候不让重新渲染组件,后者则是深层数据改变的时候偏偏就要重新渲染组件。可以返回由 reactive()
2023-05-09 19:36:35
1005
原创 Vue响应式核心
watchEffect和watch的作用都是监听数据,不同的是watchEffect不需要指定监听谁,第一个参数直接传入监听回调函数,会根据函数中用到的数据进行自动监听,只要其中任何一个数据变了就会执行。一般watch不做其他配置的话用前两个参数就够了,第一个是监听的数据,第二个是数据改变时的回调函数,如果需要修改watch配置参数就需要第三个参数了,第三个参数是一个对象,就是一些配置属性。监听多个:传入数组监听多个数据,回调函数中返回的newValue和oldValue也会是一个数组,和传入的顺序一致。
2023-05-09 19:36:01
606
原创 Vue响应式工具
*当readony包裹ref数据时,isRef和isReadonly都为ture **Vue数据检测:isRef()、isReactive()、isReadonly()isReadonly: 检测是否为readonly只读数据, 返回布尔值。toRefs从名字就可以看出来是和toRef差不多,他们的区别就是。isReactive:检测是否为reactive数据,返回布尔值。isRef:检测是否为ref数据,返回布尔值。ref数据批量转换:toRefs()ref数据转换:toRef()
2023-05-09 19:34:45
728
原创 Vue3依赖注入
vue3中数据的依赖注入是通过provide和inject实现的,provide负责在父级组件中提供一个要传递给子组件的值,inject负责在子组件中接收父组件提供的值。如果想要注册全局任何组件都可以用的数据,可以通过app.provide进行全局注入。在全局中通过app.provide注入数据。在父组件中通过provide注入数据。在子组件中通过inject获取数据。父组件通过provide提供值。子组件通过inject接收值。
2023-05-09 19:33:54
393
原创 Vue3生命周期
如果不使用这个生命周期的话子组件报错的时候浏览器里会直接报错,使用这个生命周期会捕获到错误,浏览器中就不会报错了,错误可以在这个生命周期中处理。使用keep-alive组件缓存时,离开页面时调用,等同于deactivated。组件创建前触发,等同于beforeCreate和created,没有this。使用keep-alive组件缓存时,进入页面时调用,等同于activated。组件挂载后触发,dom加载完毕。组件挂载前触发,等同于beforeMount,组件更新前调用,等同于beforeUpdate。
2023-05-09 19:31:35
1793
原创 Vue笔记-Setup
因为返回的是渲染函数,渲染函数只是渲染当前是组件内容,没有返回其他数据。所以返回函数的话数据就只能在组件内部使用,不能在组件外部访问,因为没有return数据。context是上下文对象,里面有attrs,slots,emit,expose。在setup中一般是返回一个json对象,里面是data数据。当data中有一个name,setup中也有一个name时,会用哪个呢?expose官方称为:暴露公共属性,就是用来暴露给父组件的属性用的,:在子组件中有name和age两个数据,只暴露出name数据。
2023-04-05 15:53:13
823
原创 electron打包ffi-napi报错 npm ERR! gyp reason: read ECONNRESET
网上其他人报错都是403,我的是根本没连接上服务器。因为我连的是公司的网络,公司的网络经常会屏蔽一些东西,比如哔哩哔哩就打不开。了,在package.json中去掉ffi-napi就可以打包,但是打包运行后提示缺少ffi-napi,所以必须带着ffi-napi打包。刚开始我以为是ffi-napi依赖包的问题,然后重新npm install了好多次,打包依然是这个问题。我本来连的是公司的wifi,更换了一下网络,打开手机热点,让电脑连接手机热点。然后百度有人说是镜像源的问题,换了镜像源还是不行。
2022-11-23 14:06:48
5102
6
原创 electron-vue脚手架搭建的项目,运行后报错:Object.fromEntries is not a function
解决办法:安装polyfill-object.fromentries,在项目根目录执行命令。
2022-09-27 20:27:30
998
原创 Vue3状态管理-小菠萝Pinia快速入门学习
pinia是vue3官方的状态管理工具,当然vue2也可以用。vue2中的状态管理工具是vuex,vue3中不再使用vuex,推荐使用的是pinia, 和vuex差不多,但比vuex更方便、更强、更好。所以你也可以把pinia理解为vuex的升级版
2022-09-24 18:22:50
1699
2
原创 JS事件处理机制/微任务和宏任务
任务、微任务、队列和时间表: https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/创建一个微任务:queueMicrotask。
2022-09-04 11:06:00
424
转载 react警告hash history cannot push state it is ignored
react-router4.x有三种模式* BrowserRouter* HashRouter* MemoryRouter在使用HashRouter进行开发过程中,会遇到这个问题Warning: hash history cannot push state it is ignored解决办法是使用Object对象方式传参就可以了this.props.history.push({ pathname: '/' }) // hashRouter (正确) // this.props.his
2020-07-18 22:34:56
1289
转载 Js递归遍历所有子节点
js递归遍历json所有数据// 递归遍历chartOptions 删除掉没有显示的一些属性function getAllJson(jsons, name, sign) { if(name == "" || name == undefined) { name = "json" } for(key in jsons) { var k = name + sign + key; if(!(jsons[key] instanceof Obj
2020-07-15 15:20:59
3137
原创 react最新跨域方法之http-proxy-middleware
react跨域 http-proxy-middleware安装 http-proxy-middleware 模块npm install http-proxy-middleware --save-dev在 src 文件夹下 创建 setupProxy.js 文件const { createProxyMiddleware } = require('http-proxy-middleware'); module.exports = function (app) { app.use(
2020-07-15 15:10:33
1631
1
原创 react跨域安装Http-proxy-middleware报错:proxy is not a function
react跨域安装Http-proxy-middleware报错:proxy is not a function查看了http-proxy-middleware的官方文档,发现最新的1.0.0版本已经对模块的引用作了明确的要求0.x.x版本的引用方式const proxy = require('http-proxy-middleware');1.0.0版本的引用方式const { createProxyMiddleware } = require('http-proxy-middleware')
2020-07-15 15:06:26
963
1
转载 js判断页面是否有滚动条
js判断页面是否有滚动条其实只需要一行 JS 就可以,测试兼容 IE7function hasScrollbar() { return document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight);}一般情况下,使用 document.body.scrollHeight > window.innerHeight 就可以判断。但是在 IE7,IE8 中 win
2020-07-15 15:00:44
1071
转载 用JS怎么获取浏览器滚动条的宽度
知识点:offsetWidth:获取到的值是width+padding+border;clientWidth: 获取对象可见内容的宽度,不包括滚动条,不包括边框;function getScrollbarWidth() { var odiv = document.createElement('div'),//创建一个div styles = { width: '100px', height: '100px',
2020-07-15 14:55:25
1424
转载 echarts X轴项目文字过多显示不全的三种解决方案
echarts x轴标签文字过多导致显示不全怎么办解决方案1:xAxis.axisLabel 属性axisLabel的类型是object ,主要作用是:坐标轴刻度标签的相关设置。(当然yAxis也是一样有这个属性的)axisLabel: { interval:0, rotate:40 } 以上就可解决x轴文字显示不全并将文字倾斜稍微解释一下interval坐标轴刻度标签的显示间隔(在类目轴中有效哦),默认会采用标签不重叠的方式显示标签(也就是默认会将部分文字显示不全
2020-07-15 14:51:21
10381
原创 ivew图标icon在vue项目form表单中不能正常使用,有的能正常显示,有的不能显示
问题描述:ivew图标icon在vue项目form表单中不能正常使用,有的能正常显示,有的不能显示。我使用iView的时候是从百度直接搜索的iView官网打开看的组件Api,但是有些icon组件图标就是一直不显示,而有些可以显示。问题原因:版本号不正确后来去网上看了好几个文章都不能解决我的问题,最后在github上看到一个Isuse解决了。原来是百度搜到的iView官网默认是iView1.0的版本Api,而我代码中现在下载最新的是iView4.X的版本,所以Api肯定和1.0的版本对应不上。其实
2020-07-15 14:40:31
706
转载 Vue使用Eslint报“Parsing error: x-invalid-end-tag“错误的解决方案
Vue2中Eslint报"Parsing error: x-invalid-end-tag"错误的解决方案问题原因vue将标签渲染为原生html标签时,由于这些标签是自闭合的,所以有end标签会报错。解决方案1.打开package.json2.在eslintConfig.rules中添加x-invalid-end-tag为false"rules": { "vue/no-parsing-error": [ 2, { "x-invalid-end-tag": fals
2020-07-15 14:24:57
9494
原创 微信小程序入门文档
小程序入门文档微信小程序介绍微信小程序,简称小程序,英文名Mini Program,是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或搜一下即可打开应用。小程序官方文档地址:https://developers.weixin.qq.com/miniprogram/dev/framework/小程序账号注册微信开发者工具介绍项目创建基础知识小程序发...
2020-03-13 16:32:37
1744
原创 uni-app入门文档
uni-app 学习记录文档一. uni-app 介绍1、什么是uni-app?uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台。即使不跨端,uni-app同时也是更好的小程序开发框架。2、uni-app适用于哪些人员?所有的前端开发人员,尤其是a...
2020-03-13 16:21:15
9636
原创 Chrome谷歌浏览器不支持css字体小于12px的解决办法
问题:有时候设计图上会有小于12px的文字,css的font-size小于12的时候在IE上是正常显示的,但在Chrome里面显示仍然是12px,解决办法:就是利用css3的transiform缩放属性.text-font{ font-size: 6px; /** IE **/ -webkit-transform: scale(0.5); /** Chrome解决方法...
2019-02-24 21:47:06
838
转载 js、jquery 获取父节点、子节点、兄弟节点
一 js 获取父节点,子节点,兄弟节点var test = document.getElementById("test");var parent = test.parentNode; // 父节点var chils = test.childNodes; // 全部子节点var first = test.firstChild; // 第一个子节点var last = test.last...
2019-02-17 13:31:33
390
转载 event、event.target、event.preventDefault兼容IE8
event对象在chrome、firefox等浏览器中,event对象可从事件函数的参数中传入。ie8中须从window对象中获取。 $("#btn").click(function(e) { var event = e | window.event; })targete.target用于获取当前元素,和this差不多。但是在ie8中,不支持e.target。可以...
2019-02-17 13:23:56
972
转载 Html标签textarea怎么去掉过滤多余空格
今天在做页面的时候发现写的textarea中会有一些默认的空格出现,鼠标可以在里面任意点击。发现,原来是<textarea></textarea>标签没有写在同一行所致。。。在Html页面中如果要定义一个多行文本的字段,如:“调整原因”、解决方案“”、“个人意见”等等,经常需要用到<textarea></textarea>标签。正常情况下,我...
2019-02-16 19:35:13
3861
2
转载 HTML如何修改placeholder属性中文字颜色
今天在群里看到群友问了一个这样的问题,就是如何更改placeholder属性中文字的颜色,以前用过这属性,却是没更改过颜色,于是便试了试,中途遇到些问题,查找资料后特来总结一下。 熟悉HTML5的人应该都知道,placeholder这个属性是HTML5中新增的属性,该属性的作用是规定可描述输入字段预期值的简短的提示信息,该提示会在用户输入之前显示在输入字段中,会在用户输入字段后消失,有些浏览...
2019-02-16 19:28:43
9264
转载 在旧项目中使用Vue(非npm安装)
现在vue可以算的上是很火的一款前端框架了,他的模块化的开发方式得到了很多企业的认可,在很多领域都有很广泛的应用,这里有我自己对这个框架的一些认识和了解,希望大牛多多指导1.项目比较老,想用vue的开发模式,但重写的周期,难度有很大,那该怎么办呢?我们可以不用vue的npm安装的方式,直接js引入vue.js就行,也是可以使用的2.要用vue的公共模板组件改怎么办? 1)首先我们将组件提...
2019-02-16 19:18:28
2817
转载 最完美的底部CSS布局: Sticky footers
html结构:<div class="container"> <div class="content-wrapper> <div class="content">内容区域,可随机长度</div> </div> <div class="close&q
2019-01-17 21:11:55
390
原创 网络技术—NTFS的数据管理功能
1.查看权限 文件夹右击-属性-安全2.文件有哪些权限? windows serves 2003提供七种权限:完全控制权限、修改权限、读取和执行权限、列出文件夹目录权限、读取权限、写入权限和特别的权限。3.文件移动后的权限有哪些改变? ①如果将文件从一个文件夹移到同一卷中的另一文件夹,则文件保持原有NTFS权限。 ②如果将文件从一个文件夹移到不同卷中的另一文件夹
2016-09-29 16:29:40
418
原创 网络技术—本地用户和组课堂笔记
1.用户名命名规则 用户名应为1-20个字符 不能与指定计算机上存放的其他用户名相同 用户名不能包含特殊字符 不能只用句号和空格组成2.账户分类 Administrator账户 Guest账户 Windows Server 20033. CMD新建用户 net user 用户名 密码 /add 添加 删除用户
2016-09-29 16:26:15
339
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人