前端
文章平均质量分 57
前端
爱敲代码的小冰
敲代码,成就不一样的自己……
展开
-
vue3中的vuex理解
vuex,概念理论什么的,我就不多说了。本博文主要讲解它的一些常用方法和持数据的持久化(本文是以模块化来写的)。//实际中,我们是不应该直接提交(**Mutation**)里面的,只是通过(**Action**)去分发。2、在根目录下新建一个store目录,再在该目录下新建一个index.ts文件(做为vuex的入口文件)//分发,对应user.js 中 action 里的 **setActionsCount**//对应user.js 中 action 里的。//只是做为提交(**Mutation**)原创 2024-01-26 16:44:30 · 406 阅读 · 0 评论 -
宝塔部署node项目
1、首先,我们把在本地中的项目打包成zip。(这儿有个需要注意的地方,那就是在打包的时候,不要把项目中的 node_modules 这个目录也打包上去了,不然如果项目很大的话有时会失败的),如下图所示。今天,我特意在本地的电脑上安装了一个虚拟机,同时,在虚拟机上安装了linux系统。ndoe,想必大家都不会陌生,只要是干开发的都知道。那么,在宝塔中,要怎么部署node的项目呢?2、当然,在宝塔中,我们得安装好一些常用的软件,比如node 和 nginx等软件。最后,在浏览器输入域名后,可能会报如下的错误。原创 2023-08-26 14:14:24 · 1696 阅读 · 0 评论 -
h5地理定位
在项目开发中,总免不了做一些定位的功能。特别是在电商的项目中,做地理定位再正常不过了。当然, 说到定位,大家第一反应就是腾讯地图、百度地图、高德地图。不错,其实,我也是用这些。当然,你也可以不用https,只用http,不过,这样定位是不准确的。(如果用http协议,腾讯地图会定位到当前县/区的中心,而百度地图会定位到当前市市中心)其实,不管哪个厂家的地图,无外乎都是先拿到当前的经纬度,然后再跟据经纬度做地址解析。当然,最最最最重要的。记住,是https,https。之后,在js中,写入以下函数。原创 2022-12-23 09:40:44 · 3724 阅读 · 4 评论 -
vue + vant实现图片上传加水印
(注:以下的代码都来自于csdn,只是我把两部份代码合在一起来实现我的需求而已,在最后面,我也会附上原作者的接,大家都不容易)base64转file:【https://blog.csdn.net/qq_43886365/article/details/126729188】图片加水印 :【https://blog.csdn.net/King0217/article/details/121562949】代码就是这些,然而,在此中,我是把图片加水印和图片base64转file两个不同的博文混在一起写的。原创 2022-12-18 11:11:57 · 1576 阅读 · 4 评论 -
css常用操作技巧
如果遇上最后一行没有填满整个合子。那么,如果使用了弹性布局的两端对齐的,就会出现最后一行无法实现左对齐的情况,如下图所示。1、弹性布局最后一行左对齐(针对级使用了 justify-content:space-between)其实,对于这个方法,我们可以用一行简单的css代码即可解决,即用父元素的伪元素即可。原创 2022-11-26 14:51:15 · 252 阅读 · 0 评论 -
el-tree树状的使用
研究了一下elementUi框架里的tr-tree的用法。趁着现在还有些头热,先记下我所学习到的内容吧。el-tree在实际工作中使用还是蛮多的,比如权限控制,商品无限级分类……都会用上它。先贴一段我学习的代码吧。原创 2022-10-31 10:57:33 · 1973 阅读 · 0 评论 -
对前端开发的一些小总结
那么,如果你还是按以前的惯例去修改第三方ui(比如 【elementUi 、vantUi】)的样式,那是不能修改的。然而,随随着自己学习的积累和工作经验的积累,慢慢发现。注意在style标签里面的那个scoped,它的意义就是让这里面的css只针对于当前这个页面有效,不会污染其他的页面。/*也就是说,如果需要修改ui里面默认的样式,我们直接在控制台里面找到它的类名*//*然后,在这里面把需要的改了,同时在类名前面加上 /deep/ 就完事*//*请注意,【/deep/】 是固定写法*/原创 2022-10-31 10:53:59 · 524 阅读 · 0 评论 -
uniapp跨域的问题
所以,在这儿我也附上我php的代码,php也遇好做上跨域处理。1、使用 HBuilder X 工具运行项目,找到 manifest.json 文件,把下面的的代码复制到你的项目中,注意修改你的url地址。然而,在使用uniapp开的时候,总会遇上跨域的问题。在这儿我也就多插一句,如果说对于php获取不到前端post过来的值的时候,可以试试下面的方法。3、在页面上使用,在pages/index/index.vue文件中,贴上。当然,如果为了保险起见,也可以都写上,也没啥毛病。1、在入口文件处添加以下代码。原创 2022-09-05 09:53:26 · 5081 阅读 · 1 评论 -
js中 scrollHeight、clientHeight、scrollTop的理解
滚动触底加载数据,之前我也有写过博客,如果有需要,可以去看我之前写的博客 【https://blog.csdn.net/weixin_42371812/article/details/126450708】前段时间,自己手写了一个滚动触底加载数据的功能。今天有空,所以自己特意去研究了下它的原理。所谓的懒加载,就是在页面上先用一个静态的图片做一个占位符,等滚动那个图片位置的时候,再从后端请求数据,把真实的图片放到页面上。那么,这儿,我也就只说下我的大概思路,说的不好请大家在评论区里指出来。原创 2022-09-03 09:50:57 · 771 阅读 · 0 评论 -
vue滚动加载数据
在做移动端业务的时候,经常需要对数据进行滚动加载。所谓的滚动加载,其实就是像小程序那样的,触底加载数据。别听的字里行间听的那么高大上。当然,对于滚动加截,常见的也就跟我们在PC端的分页的业务逻辑是一样的。滚动到底部的时候请求一次(或者在PC端来说是点击下一页),都是一样的意思。滚动加载,它的主要逻辑就是监听winow的滚动事件,滚动到页面底部的时候执行数据请求的方法就完事了。下面,我这儿的是纯前端处理的滚动加载(也可以说是分页)都是一样的意思。然而,对于分页,我之前的博文也有介绍过,原创 2022-08-21 15:51:44 · 3457 阅读 · 3 评论 -
Visual Studio Code 设置左则文件树状的缩进和右边编辑器代码结构的缩进
3、如果在设置之的代码不是现在这个设置缩进值的。那么,上面的设置会对之前的代码缩进失效。那么,有效的办法就是在搜索中搜索 【Detect Indentation】,如下图所示。1、如果项目目录中有一个叫 【.editorconfig】的文件,我们只需要把 【indent_size 的值设置为 你想的缩进值即可】2、同时,打开软件中的设置搜索 【tab size】,按如下图修改。对于右边编辑器代码的tab缩进,依次按下面的步骤操作即可。左边的文件目录缩进,按以下操作步骤即可。1、在设置中搜索 【tree】..原创 2022-08-17 11:32:27 · 1121 阅读 · 0 评论 -
vue中 ref attr listeners的使用方法
vue在实际的工作当中,ref、attr、listeners 这三个属性是经常会使用到的。刚才开我也不太明白这三个属性的用法,后来在做项目的时候,我不得不去学习。//而myfn这个方法就是父组件通过ref执行的,msg就是父组件传的参数。//所以,当父组件中点击按纽的时候就会执行到这个子组件myfn方法。............原创 2022-08-15 17:21:40 · 367 阅读 · 0 评论 -
element ui 结合 vue 和 php的分页讲解
那么,在开发中,分页是一个家常便饭,每一个开发人员都会遇上。从古以来,处理分页都有两种方案,一种是前端处理,另一种就是后端处理。(主要看下面红框的三个部份)现如今是前后端分离的天下。后端管后端的工作,大家彼此不相干。如果开发文档写得很详细,可以说两组人“老死不相往来”都可以。前端处理,其实就是后端只需要返回一个所有的数组集合给前端。而前端只需要拿到这个集合做分页处理就行。.........原创 2022-08-15 13:56:35 · 523 阅读 · 0 评论 -
js实现无限级分类
在平时的开发中,常常会遇上做类似无限级分类的功能,比如说中国城市的三级分类,或者是电商系统中的商品分类等等。在这儿,我也给大家分享几个无限级分类的代码。当然,也还有一种写法,它封装后是树状的,也就是每一个父级下都会有一个child,对应它的子级。调用出来的结果就是这样子的。...原创 2022-08-12 17:17:13 · 992 阅读 · 0 评论 -
关于js 中对 this的理解
那么,问题就来了,从这么一个简单的demo中,我们可以发现,对于箭头函数,this是没有上下文指向的,它指向的都是整个最外层的对象。就如在vue中,this指向的都是当前的最外层对象。而普通的函数,它的this永远都是跟着它上下文走的。在js的世界里, js 对开发人来说很似熟悉,可以说百分之九十九点九九的前端开发人员都会用动这个this。但大家可曾想过,对于this,你是否真正的了解过它呢。从上面几个demo,我们可以了解到,对于使用了call()函数的,this是会发生改变。来一个实例来演示一下。...原创 2022-08-10 19:24:39 · 314 阅读 · 0 评论 -
js在线预览pdf,doc,xls,jpg等文件
由于项目需要,需要在上传文件后在线预览所上传的文件。最开始我的思路就是想到各种插件什么的。比如说pdf.js、pdfobject,但最后都没能达到我所想要的效果。原创 2022-08-09 13:44:09 · 6890 阅读 · 7 评论 -
echart进阶
这几天的工作都是跟echart打交道。可以说对echart有一些简单的基本认识了。不多说,来点干货吧。原创 2022-06-28 21:02:40 · 436 阅读 · 2 评论 -
谷歌浏览器解决临时跨域问题
解决临时跨域问题原创 2022-06-17 13:03:01 · 422 阅读 · 0 评论 -
对uniapp中的webview的理解
今天花了将近一天的时间去研究了一下uniapp中的webview组件的应用。说起webview,想必大家都不会陌生,开发小程序的朋友或多少都会用上。记忆之中,当时开发小程序的时候只是做了一个跳转,然后展示,并没有其他的。现在,再次拿来研究,新的东西还是蛮多的。<!--一个最为简单的代码--><view class=""> <web-view src="http://www.vuestage.bnc/" @message="message" @onPostMe原创 2022-04-02 21:00:30 · 8084 阅读 · 0 评论 -
vue $emit 和 $on的用法 (在同一个组件中)
百度之后,终于明白$emit 和 $on 的基础用法。不多说 ,直接上课。$on('事件名字'); /监听事件,事件名字是 str型$emit('事件名字',回调函数);//事件名字是 str型,当然,可以有多个事件名字,如果存在多个事件名字,那么就是用数组。假设有一个按纽,希望在点击按纽之后触发某一个方法。那么我们可以这样。<button @click='emit'>只触发一个方法</button>created () { this.$on('wash原创 2021-08-16 11:29:21 · 1255 阅读 · 0 评论 -
ie不支持 es6的解决方法
当前,es6正是大家都喜欢的时候,可对于es6的兼容性,大家可是又爱又恨。正如多数开发者所说,如果这世上没有IE浏览器,那是多好的事儿啊。可现实并没有我们程序员想像的那么完美。在喜欢es6的同时,IE总会来捣乱。当然,这也是有办法解决的。(只需要一条 node.js的命令就可以解决)npm install babel-core@5 //只需要这个命令,下载走起,然后就可以使用了//使用...原创 2020-04-05 20:25:00 · 2393 阅读 · 0 评论 -
php实现无限级分类(前端代码)
在做商城系统的时候,总会免不了对商品进行分类。对于一般的商品分类,如果是纯一级分类那好办,只需要做一个分类表,然后再做一个商品表。但是,如果是多级分类呢,那事情就没有那么简单。1、在php端//先在php端模拟一个段数据//在实际运用中,数据是直接从数据库中取的//这里先来个模拟的$arr = [ [ 'id'=>1,'name'=>'中国','pid...原创 2020-02-21 13:30:48 · 457 阅读 · 0 评论