自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(20)
  • 收藏
  • 关注

原创 自动化构建小体验

自动化构建自动化 ,通过机器代替手工 构建,就是转化,比如具有更高编程性的sass转换成浏览器可以识别的css简单的体验下自动化构建在工作中为了提高编程性,我们会使用sass来编写css样式,可是浏览器不支持sass,所以还需转换成css首先我们先安装下包管理文件package.json,并安装sassyarn inityarn add sass --dve在根目录创建scss\main.scss文件编写你的sass内容需要将sass转换成css供浏览器识别利用node_modules.

2020-12-23 00:18:09 259

原创 创建自己的脚手架工具

常用的脚手架工具特定内容的:react-cli ,vue-cli通用型(灵活可扩展 创建项目时用): Yeoman可创建特定类型组建的:Plop重点来说一下YeomanYeoman用于创建脚手架开发的工具,居于node.js开发的基本使用先全局安装Yeoman 的i/o工具yo//使用yarn安装yarn global add yo //使用npm安装//npm install yo --global还需安装对应的generator//使用yarn安装yarn glo

2020-12-22 11:42:34 495

原创 学习TypeScript笔记

对于一个不熟悉的事物一般我们会有三问,是什么?有什么用?怎么用?围绕这三问,来学习TypeScript。1,TypeScript是什么TypeScript 是 JavaScript 的一个超集,主要提供可选的静态类型,类和接口。2,有什么用 ?为了解决JavaScript类型系统的问题。提高代码的可靠程度说到这你可能会问 JavaScript类型系统有什么问题?那我们先谈谈JavaScript的类型系统分为七种语言类型:Underfined、Null、Boolean、String、Numbe

2020-11-17 21:54:59 419 1

原创 Flow的使用

flow 是 Facebook 推出的 js 静态类型检查工具。flow可以在代码运行前对类型错误进行检查,包括:类型错误对 null 的引用以及可怕的 “undefined is not a function” flow 允许我们给变量添加类型快速上手//初始化项目配置(我这是用yarn,npm之后补充)yarn init -yes//安装flowyarn add flow-bin -dev//初始化flow 获取初始化flow配置文件yarn flow init在用vs c

2020-11-17 18:37:01 1266

原创 ES6新特性

let 与块级作用域通过let 声明的变量 只受当前作用域影响1、实现块作用域2、不存在变量提升。const声明一个只读的常量,声明的同时就需要赋值,不允许修改。本质:const实际上保证的,并不是变量的值不得改动,而是变量指向的那个内存地址不得改动。对于简单类型的数据(数值、字符串、布尔值),值就保存在变量指向的那个内存地址,因此等同于常量。但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指针,const只能保证这个指针是固定的,至于它指向的数据结构是不是可变的,

2020-11-09 19:09:52 279

原创 纯css实现加载动画

先看效果图html部分 <div class="loaderBox" > <div class="loaderMain"> <div class="shu">加载中...</div> <div class="loader"></div> </div> </div>css部分 /* 加载中样式 */

2020-06-08 11:38:33 251

原创 小程序按需求获取相应时间

在实际的开发中,获取当前的时间都是基本的操作了,有时候需求就是有一丁点的差别,这时候我们就要做相应的改变如下:想获取比当前时间后一分钟的时间上代码:function haveSomeMinutesTime(n) { if (n == null) { n = 0; } // 时间 var newDate = new Date() // var timeStamp = newDate.getTime(); //获取时间戳 var date = newDate.setMinut

2020-06-02 10:44:25 364

原创 前端常用js加密方法

这里罗列前端常用的js加密方法base64加密<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>base64加密</title><script type="text/javascript" src="base64.js"></script><script type="text/javascript"> v

2020-05-19 13:14:29 594

原创 小程序使用组件

先在最外层创建个组件文件夹,再新建component目录如图:在组件的json文件中可以看到申名其是一个组件 “component”: true,在你想调用组件的页面的json中引入该组件如图:在页面的wxml中应用<submit_bar ></submit_bar>实现父组件对子组件的传值父组件中<submit_bar totalMoney="{{totalMoney}}" ></submit_bar>子组件中接收proper

2020-05-16 17:01:49 353

原创 echarts的简单实用

echart的简单应用实现个柱形图sdk引入echarts链接:的资源文件,你可以去 echarts官网下载,放到自己的服务器上 <script src="http://cdn.suoluomei.com/common/js2.0/echarts/4.2.1/dist/echarts.min.js"></script>在HTML那申明个节点 <div id="line"></div>js部分 getPolylineChart() {

2020-05-16 15:27:49 409

原创 layui中laydate动态赋值最大、最小值

最近有用户反应layui的laydate时间选择有问题,不让选,附上图片查看了下是最大最小值的问题由于laydate.render无法重复渲染,当laydate.render对应一个elem已经渲染过一次之后,我们是无法通过再次渲染来修改其中的max值与min值的。可以通过 starDate.config.max和 endDate.config.min 来更改,注意它是一个对象,不是一个 字符串,需要对其一一赋值以下是我的实现的代码片段 var starDate = laydate.rend

2020-05-16 14:33:07 2243

原创 小程序仿淘宝商品详情头部导航

小程序仿淘宝商品详情头部导航使用的是scroll-view 组件的scroll-into-view,回到某个位置 和bindscroll滚动监听 。并利用wx.createSelectorQuery()获取位置wxml部分代码如下:<view class="top_nav" hidden="{{hiddenNav}}"> <view class="{{navId==index?'naved':'nav'}}" wx:for="{{nav}}" bindtap="toScroll

2020-05-14 18:21:30 864

原创 h5获取验证码倒计时

啥也不说上效果实现代码如下:css.input { width:100px; line-height:40px; text-align:center; background:#00a1ea; color:#fff; border:none; cursor:pointer;}.inputed { width:100px; line-height:40px; text-align:center; background:#ccc; color:#000; border:no

2020-05-13 12:23:01 424

原创 jq实现上下滚动

实现上上下滚动效果啥也不说上效果引入资源文件jq<script src="http://cdn.suoluomei.com/common/js/jquery-2.1.4.min.js "></script>css * { margin: 0; padding: 0; } .scroll-box { width: 200px; height: 100px; border: 2

2020-05-13 11:43:53 1995

原创 微信小程序实现横向导航滚动

实现如今日头条那样横向滚动wxml结构如下: <view class='index_tab'> <scroll-view class="bottom_scroll" scroll-x="true" scroll-left="{{x}}" scroll-with-animation="{{true}}"> <view class='nav {...

2020-04-29 18:46:38 1141

原创 小程序使用模板template

在编码的时候,你可能会发现设计的页面中有多相似的地方这里我们就会想到用组件,和模板,在这里我说下模板首先把我们写好的样式用<template name="courseLeft"></template>标签包起来,申明这是一个模板,模板名为courseLeft(你可以自定义命名),之后把你的模板样式写在中间如:<template name="courseLe...

2020-04-29 09:48:32 275

原创 HTML使用vant的an-address-edit

1,引入vue 和vant<link rel="stylesheet" href="https://cdn.suoluomei.com/common/js2.0/npm/vant@2.2/lib/index.css"><script src="http://cdn.suoluomei.com/common/js2.0/vue/v2.5.16/vue.js"></s...

2020-04-23 10:45:53 911

原创 vue报错 运行npm run dev报cjs.js缺失

vue 运行 npm run dev 或者npm run serve 报core-js/modules/es6.array.find in ./node_modules/_cache-loader@2.0.1@cache-load,这是因为当前模块没有升级,或者下载掉包,只要重新下载安装就可以了,执行 npm install core-js@2 //更新版本以下是报错部分内容...

2020-04-20 16:46:29 7356

原创 手撸一个vue 4.0

之前一直使用的是2.0的vue,听说最近出了个vue4.0 (据说是2019-10-16发布),3.0 都还没看。。。。要开始一个4.0 需要需要看本地的环境 node ,npm终端输入下面展示一些 内联代码片。node -v //查看 node 版本npm -v //查看 npm版本当然你可以输入vue -V // 查看当前vue的版本官方建议要安装vue 4.0 的话no...

2020-04-20 16:33:50 2398

原创 css旋转

css旋转 transform: rotate(90deg);

2020-03-19 18:35:46 147

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除