- 博客(29)
- 收藏
- 关注
RSS订阅原创 为什么element ui 中表单验证validate验证成功不执行验证成功的逻辑代码
element ui 中表单验证validate验证成功不执行成功的逻辑代码首先今天做项目时遇到的一个问题，下面代码中，如果上面的验证规则通过但是不会执行验证通过的代码，只有验证不通过才会输出else里的代码this.$refs[formName].validate((valid) => { //valid为true时代表所有验证规则通过 if (valid) { //验证通过执行的代码，不执行 } else { c
2021-08-06 15:57:10
3307
3
原创 typescript中的类型声明和定义规则
1.只声明类型let a:number;//声明a为number类型2.声明类型并赋值 let b:string='ss'3.不声明类型的话直接赋值，默认指定类型为赋值的内容类型let c=true//c默认被ts解析Boolean类型 4.字面量的声明方式，类似于const，固定值 不可修改的let d:10//d只能是105.字面量多类型声明，可以用|或者符号声明多种类型let e:11 | '你好'//e只能是 11 或者 '你好'// 或者let f :stri
2021-05-23 01:48:44
1501
原创 vue中rem适配方案
解决vue移动端适配问题目标一 、手机适配：就是页面上的尺寸，无论高度，还是宽度，还有字体，随屏幕的宽度变化！这里是屏幕宽度！是不是想到了vw，对，就是这个意思；——最大程度在各个尺寸屏幕上还原设计稿目标二、px转换成rem：一般UI给的设计稿宽度大小是750，所以，我们想直接写上面UI标记的尺寸；——最大程度减少工作1.下载postcss-pxtorem工具包postcss-pxtorem: postcss的一个插件，主要是帮你把px转换成对应的rem；然后：还要用js代码去动态算根目录应该有
2021-05-18 17:21:45
567
原创 echarts图表的dataset功能
echarts的dataset功能ECharts 4 开始支持了 数据集（dataset）组件用于单独的数据集声明，从而数据可以单独管理，被多个组件复用，并且可以自由指定数据到视觉的映射。这在不少场景下能带来使用上的方便我们不需要把每个图表数据插入到 series，可以在外面声明好，直接配置好。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta
2021-05-11 21:03:45
1086
原创 数据可视化echarts图表库如何使用和配置？
数据可视化echarts图表库如何使用和配置？Echarts，一个纯 Javascript 的图表库，可以流畅的运行在 PC 和移动设备上1.Echarts的优点：1、国人开发，文档全，便于开发和阅读文档。2、图表丰富，可以适用各种各样的功能。3.开源、免费2.Echarts使用1.下载要使用的Echarts图表库到项目中下面是使用的下载js文件格式引入到项目中官方地址：http://echarts.apache.org/zh/2.在项目中引入配置<!DOCTYPE html&g
2021-05-11 19:23:08
364
原创 如何更换Echarts渲染模式？
如何更换Echarts渲染模式？默认情况下我们下载使用的Echarts渲染模式是canvas，打开检查元素我们可以看到，但是它同时支持svg渲染，可以根据我们业务需求进行修改。canvas和svg区别？1.canvas生成的是图片，位图（也称像素图），不能单独选中某个图形，只能选中整体2.svg:放大不失真，能单独选中局部的某个图形，并且可以用css,js来操纵默认Echarts用canvas渲染图表，但可以通过renderer来修改渲染模式 echarts.init(dom,null,{re
2021-05-11 19:14:26
2430
转载 了解和简单使用canvas画布
Canvas什么是 canvas?HTML5 元素用于图形的绘制，通过脚本 (通常是JavaScript)来完成. 标签只是图形容器，您必须使用脚本来绘制图形。你可以通过多种方法使用 canvas 绘制路径,盒、圆、字符以及添加图像。创建一个画布（Canvas）页面创建一个画布容器<canvas id="clock" width="650" height="650"> </canvas>canvas起初是空白的。为了展示，首先脚本需要找到渲染上下文，然后在它的
2021-05-09 11:33:01
162
原创 Ajax跨域如何解决？
Ajax跨域如何解决？1.什么是跨域跨域，是指浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对JavaScript实施的安全限制。同源策略限制了以下行为：Cookie、LocalStorage 和 IndexDB 无法读取DOM 和 JS 对象无法获取Ajax请求发送不出去同源就是指，域名、协议、端口均为相同。其中一个不一样就为跨域2.跨域如何解决1.jsonp方式jsonp跨域是JavaScript设计模式中的一种代理模式。在html页面中通过相应的标签从不同域
2021-05-07 00:17:16
680
原创 如何用原生js写Ajax请求？
如何用原生js写Ajax？我们通过绑定按钮点击事件来请求Ajax<body> <button>点击发送 </button> <div> </div> <script> let btn =document.getElementsByTagName('button')[0] //绑定点击事件触发请求 btn.addEventListener
2021-05-05 23:21:29
436
原创 如何使用node.js和express快速搭建一个服务器？
使用node.js和express快速搭建一个服务器1.下载安装node.js官方地址：https://nodejs.org/en/按照好操作一步一步安装好后，可以打开终端，在终端中查看是否配置好了node.js输入：node -v如果出现版本号说明你已经安装成功2.搭建服务器1.创建一个新的文件夹初始化文件夹在文件夹打开终端，输入npm init --yes即会创建一个文件：package.json，里面会显示你得配置项和第三方包2.安装express通过npm指令安装输入：np
2021-05-04 20:19:32
188
原创 认识理解JavaScript闭包
认识理解JavaScript闭包要理解闭包，首先必须理解Javascript特殊的变量作用域，因为闭包就是变量作用域的一些问题。1.变量的作用域变量的作用域的话就分为两种：全局变量和局部变量第一种：JavaScript中的函数内部可以直接读取全局变量 var n='hello'; function fn(){ alert(n); } fn(); // hello第二种：JavaScript中的外部无法获取函数内部的变量 function fn(){ va
2021-04-30 11:34:15
67
原创 vue中通过monment.js插件来将时间戳转换为常用的时间格式
vue中通过monment.js插件来将时间戳转换为常用的时间格式在项目中很多时候需要展示时间信息，我们一般都是用时间戳来传输时间信息，但是我们在页面展示的话是我们想要的常见格式，比如：2021-4-29，这种的形式，在vue中的话我们可以去下载一个第三方的时间插件monment.js,用来专门处理时间的一个插件。插件官方地址：http://momentjs.cn/1.下载与安装//通过npm去安装下载npm install moment --save 2.在项目中引用和配置//在ma
2021-04-29 10:48:37
1283
原创 让元素水平垂直居中的几种方式
让元素水平垂直居中的几种方式平时我们做项目的时候很多情况会遇到让元素水平垂直居中的场景，可能场景不同，所以需要用不同的方式，下里面是可以实现的6种方式和他们的使用场景。列如有个设定好的div,下面是他的样式定位的话分为3种也可以说是三种情况，都是依赖于定位实现的。1.定位（1） 缺点：需要具体宽高的情况下使用 .box{ position: absolute; top: 50%; left: 50%;
2021-04-20 00:29:53
399
原创 微信小程序如何得到code获取token密钥，以及怎么微信登录授权获取用户详细信息？
微信小程序如何得到code获取token密钥，以及怎么微信登录授权获取用户详细信息？登录授权流程:点击进入–进入首页获取code请求到token–授权登录微信1.如何获取code （1） 第一步：通过wx.login得到code,调用接口获取登录凭证（code）。通过凭证进而换取用户登录态信息wx.login（）是微信小程序的内置调用接口获取登录凭证（code）。通过凭证进而换取用户登录态信息，包括用户在当前小程序的唯一标识（openid）、微信开放平台帐号下的唯一标识（unioni
2021-04-16 22:14:00
14636
2
原创 使用表驱动法编程，在项目中减少使用if -else的无限逻辑判断
使用表驱动法编程，在项目中减少使用if -else的无限重复表驱动法是一种编程模式——从表里查找信息而不是使用逻辑语句。随着逻辑复杂性的增加，if/else 或switch中的代码将变得越来越肿，所以我们常说数据比程序逻辑更易驾驭。表驱动法就是将这些逻辑中的数据与逻辑分开，从而减少逻辑的复杂度。我是在别的语言看到的，但是对于前端来说我也是很不错的编程模式和选择，虽然这些是很简单的东西，但是主要要培养自己这种解决问题的思维。1.从一个例子说起日历以一个月的天数为例，我们要写一串if/else 或者s
2021-04-16 19:59:01
252
原创 如何对的数据请求封装？
如何对微信小程序的数据请求封装1.首先微信小程序的数据请求使用的是微信自己的请求方式例如： wx.request({ url: 'test.php', //仅为示例，并非真实的接口地址 method:'GET', //请求的方式，默认是get data: { //请求时候要要传的参数对象 x: '', y: '' }, header: { 'content-type': 'application/json' // 默认值：请求头的默认请
2021-04-14 23:59:20
536
2
原创 微信小程序模板template复用
小程序模板template复用1.模板的适应场景除了component，微信小程序中还有另一种组件化你的方式template模板，这两者之间的区别是，template主要是展示，方法则需要在调用的页面中定义。而component组件则有自己的业务逻辑，可以看做一个独立的page页面。简单来说，如果只是展示，使用template就足够了，如果涉及到的业务逻辑交互比较多，那就最好使用component组件了2.如何定义使用模板第一步：定义模板 定义步骤同创建普通页面一样,创建好后在wxml页面创建
2021-04-14 11:12:13
350
原创 如何在微信小程序使用组件插槽slot？
如何在微信小程序使用组件插槽slotslot:用于在不破坏组件的情况下，给组件嵌入结构的一种方式slot在小程序中使用时分为两种情况：1.当一个组件只有一个slot插槽的时候//使用<slot></slot>的标签放到组件你想要预留位置用来插入内容的地方//在使用组件的父级中，写入组件内部的所有内容都会被放到唯一的插槽中的位置//组件中的代码<view class="box"> <text>{{title}}</text>
2021-04-14 08:28:20
1570
1
原创 微信小程序如何进行组件的传值，进行通讯？
微信小程序如何进行组件的传值，进行通讯？有时候我们使用我们封装自己的自定义组件时候需要就行组件和使用页面，或者组件之间的传值，微信小程序实现组件通讯实现方式和vue的相似，只是一些方法名字的改变1.第一种：父传子这是我们引入的子组件children,我们要通过父传子修改text的值1.如何传在调用子组件的页面 向子组件标签内添加自定义属性，向子组件传值。2.如何接在子组件的js中的properties进行接收，这里的properties相当于vue传值中的propsComponent({
2021-04-12 22:04:05
844
1
原创 微信小程序如何快速创建自定义组件使用？
一、微信小程序如何快速创建自定义组件自定义组件:自己开发组件，然后再项目中多处复用，提高开发效率，这也是组件化的核心思想快速创建一个组件的步骤：1.创建自定义组件 在微信小程序的界面创建一个新的文件夹components来放置自定义组件，然后新建一个文件夹，这里叫做mycom,右键点击新建的文件夹选择新建component，名字和文件夹也最好一致，和创建微信的小程序page页面差不多，页面也会有四个文件这四个文件夹用来写你的自定义组件内容，和page页面相似2.在需要的页面xxx.json或
2021-04-12 20:51:17
1875
原创 如何让微信小程序可以使用npm，并且使用第三方vant组件库？
一、如何让微信小程序可以使用npm微信默认不支持npm包管理工具的，如果我们想安装第三方包或者使用组件库就要使用npm，所以要让vant支持npm。如何让小程序支持npm：1.在小程序的终端先生成package.json的文件微信小程序左上角视图里打开终端，在终端输入:npm init -y成功后文件列表会多一个package.json的文件2.勾选开发者工具-详情–本地设置-npm模块3.选择微信开发者工具-工具-构建npm在微信左上角的工具中点构建npm（1）现在直接使用会提示
2021-04-12 20:18:27
245
原创 如何使用wxParse插件，在微信小程序解析富文本？
1.下载wxParse插件wxParse git地址：https://github.com/icindy/wxParse。我们下载解压后的文件夹中只需要wxParse 这个文件夹把这个文件夹放入要用的项目中。2.在微信小程序中引入并使用1.在你需要解析渲染富文本的页面.wxss文件引入wxParse.wxss//路径根据你实际情况修改@import "../../../wxParse/wxParse.wxss";2.再在你需要解析渲染富文本的页面.js文件引入wxParse.js1.
2021-04-10 21:32:24
497
原创 如何去掉微信小程序的自带头部，自定义创建？
一、如何去掉微信小程序的自带头部，自定义创建？在进行微信小程序的开发中微信小程序的头部会默认生成一个头部，用来展示每个pages页面标题，可以在app.json中的window中进行配置，但是它自身带的头部，只是能简单的配置，比如添加文字，背景颜色等等。但是有时候这些配置无法满足我们对于头部的要求，可能我们会想添加一个图标或者进行多样化的布局，这个时候我们就要把微信小程序自带的头部移除创建自己的头部样式。 在app.json 的window中配置： "navigationStyle":"custo
2021-04-09 08:22:16
5780
2
原创 如何使用微信小程序开发？
一、小程序布局与普通web开发差异1.小程序实现响应式单位：rpx相当于rem小程序的设计稿通常是按照iphone6 宽度为750的尺寸设计的.logo {width:80rpx,height:80rpx}2.样式导入@import "要引入的外部样式文件"意义：大型项目开发中，为了方便样式复用例如：@import "/public/css/style.wxss";3.行内样式<view style="color: {{index===1? 'red' : ''}}"<
2021-04-08 21:51:59
142
原创 微信小程序的标签和指令如何使用？
一、微信小程序的常用标签有哪些？[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-QBto7C6T-1617888107657)(C:\Users\liubin\Pictures\微信截图_20210408204116.png)].wxml后缀的文件相当于html文件，用来书写结构代码，其中的一些标签和正常的html中的标签有出入，被替代或者没有了。**1. view标签：是一个块级标签，相当于普通H5中的div2. text标签：是一个行内标签 相当于span3. b
2021-04-08 21:22:34
982
原创 微信小程序底部tabBar导航如何配置
一、微信小程序如何实现底部tabBar导航微信小程序的tabBar导航也就是移动端常用的底部导航切换栏第一步：在pages中添加新pages的页面，把你要放在tabBar上要跳转的页面创建好。第二步：在app.json中把要跳转的页面路径添加到pages中。第三步：在app.json中添加tabBar配置属性第四步：在tabBar的list属性中配置要添加的条目 注意：下面跳转的tabBar页面最少配置2个，最多5个配置tabBar具体演示代码：{ .... "t
2021-04-08 20:35:18
936
原创 微信小程序开发工具安装使用和认识
一、微信小程序和普通H5的区别微信小程序没有DOM,BOM的API，只能使用EcmaScript核心 部分（数组，字符串方法，for,if…）微信小程序js逻辑和视图处理是分开独立运行的，性能比较好，而普通H5是单线程的，容易导致代码阻塞二、微信小程序的帐号注册及开发流程1.微信小程序的注册注册地址：https://mp.weixin.qq.com/wxopen/waregister?action=step1&token=&lang=zh_CN按照连接地址给出的提示进行注册
2021-04-08 07:50:24
436
原创 ES6的新增的常用特性
一 、javaScript的特性1.首先javascri是单线程的可以运行在浏览器或服务端的弱类型脚本语言1.单线程1.进程：完成一项任务所经历的的过程，一个进程可以包含多个线程2.线程：线程比进程要小，一个线程只能属于一个进程2.弱类型 变量的类型由赋值的类型决定2.JavaScript的发展1.JavaScript是1995年诞生2.javaScript于2015发布EcmaScript2015(也称ES6)标准版本3.跟踪ES最新技术进展的GitHub地址官方文档：https:
2021-04-05 16:00:00
342
5
原创 认识并且使用git
一、 什么是git？1.直接来说：git是一个分布式的版本控制工具 其中分布式是git的一个特点 说到分布式相对应的还有集中式，下面就以git和svn为例说下分布式和集中式两者的区别。1.分布式：在网络不好的情况下，不受影响，只要下载到本地后 ，可以暂存到本地仓库，等网络好的情况下再push到服务器，这样每个电脑都可以看作是一个独立的服务器，不受互相的影响。例如：git2.集中式：只有一台中心服务器，用来连接多台设备，所有的上传下载都要经过中心服务器，如果网络不好或者服务
2021-04-02 00:51:54
1482
8
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人