4 jnChen10

尚未进行身份认证

暂无相关简介

等级
TA的排名 5w+

React - 事件绑定 & 样式绑定

React中两种事件绑定方式// 1<div onClick={this.handle.bind(this)}>点击</div>handle () { // do something}// 2<div onClick={this.handle}>点击</div>handle = () => { // do som...

2019-11-18 07:38:57

Vue - nextTick()

官方文档:异步更新队列例如,当你设置vm.someData = 'new value',该组件不会立即重新渲染。此时立刻获取DOM节点中绑定的元素值可能失败,因为Vue更新DOM是异步执行的。为了在数据变化之后立刻获取更新后的 DOM,可以在数据变化之后立即使用Vue.nextTick(callback)。这样回调函数将在 DOM 更新完成后被调用。例如:<div id="...

2019-11-18 07:30:59

React - create-react-app

使用yarn作为包管理工具,安装yarnnpmiyarn-g安装项目所需的第三方包(使用antd要安装less与less-loader)yarnaddreact-router-domaxiosless-loaderlessantd需要在webpack中配置less,在项目文件中暴露webpackyarneject运行yarneject可能出现问题...

2019-11-14 21:05:12

JS - 判断空对象

var data = {}let flag1 = JSON.stringify(data) === "{}" //truelet flag2 = Object.keys(data).length === 0 //true

2019-11-14 18:43:43

Vue - mixins

官方文档:https://cn.vuejs.org/v2/guide/mixins.html混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项(data/方法/生命周期钩子函数)。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。当组件和混入对象含有同名选项时,这些选项将以恰当的方式进行“合并”,数据...

2019-02-25 22:21:52

JS - 字符串相减

参考博客:为什么js里"10000"<"8000"为trueJS是弱语言类型,如果两个数字型的字符串相减,或者其中一个为字符串时,那么会自动转换为数字类型的进行运算'10000'-'8000'//200010000-'8000'//200010000>'8000'//true但如果是两个都是数字型的字符串进行比较,那就不会自动转换为...

2019-11-08 17:58:24

Vue - better-scroll

参看博客:https://ustbhuangyi.github.io/better-scroll/doc/zh-hans/<div class="menu-wrapper" ref="menuWrapper"></div><div class="food-wrapper" ref="foodWrapper"></div>.menu-wra...

2019-11-07 22:33:00

Vue - data使用注意事项

参考:深入响应式原理、data、数组更新检测var vm = new Vue({ el: '#app', data: { name: 'jn', items: [1, 2, 3], person: { firstName: 'chan' } }})1.Vue是一个响应式框架,只有在data中提前声明的变量,才能在视图中响应。如果你...

2019-11-07 21:55:44

JS - 倒计时

let timer = setInterval(() => { let now = new Date().getTime() this.countDown(now)}, 1000)countDown(now) { let day11 = new Date(2019, 10, 11).getTime() if (day11 <= now) { con...

2019-11-07 10:47:18

前端 - 跨域请求时,出现OPTIONS方法

参考博客:一次跨域请求出现 OPTIONS 请求的问题及解决方法、跨域资源共享 CORS 详解首先了解跨域产生的原因:浏览器从一个域名的网页去请求另一个域名的资源时,协议、域名、端口任一不同,都会出现跨域。使用CORS解决跨域引起的问题,实现CORS通信的关键是服务器。只要服务器实现了CORS接口,就可以跨源通信(服务端添加代码)。浏览器将CORS请求分成两类:简单请求(simple ...

2019-10-22 22:31:01

CSS - :host ::ng-deep

参考博客:样式修改: :host ::ng-deep

2019-10-20 21:56:54

前端 - 隐藏滚动条

参考博客:::-webkit-scrollbar、微信小程序隐藏滚动条::-webkit-scrollbar { width: 0; height: 0; color: transparent; }

2019-10-14 09:39:17

小程序 - 自定义顶部导航栏

微信7.0版本后支持单页面设置自定义导航栏,官方文档所有页面设置自定义导航栏参考博客:https://www.cnblogs.com/sese/p/9761713.html

2019-10-13 22:20:54

CSS - env()

参考博客:网页适配 iPhoneX、微信小程序适配的坑在小程序自定义 tabBarCSS代码中,发现中env()函数。其作用是适配IPhoneX底部的黑色横条,使页面的底部处于横条之上.tab-bar { position: fixed; bottom: 0; left: 0; right: 0; height: 48px; background: white...

2019-10-13 20:28:04

小程序 - 自定义底部导航

小程序官方文档:自定义 tabBar、组件模板和样式参考博客:微信小程序-自定义底部导航

2019-10-13 20:05:03

小程序 - 处理发送多请求

在处理以下列表中,如果点击选项过于频繁,可能会出现数据展示错误的情况(请求函数相同,只有查询类型type不相同)async loadGood (params) { let res = await app.request(api.Works_Screen, params) if (res.code === 1) { let { list } = this.data ...

2019-10-12 16:05:10

小程序 - Canvas折线图 & 环形图

折线图支持触摸显示详细数据(使用了两个Canvas,下面一层做折线图展示,上面一层做详细数据展示)饼图代码参考博客:Canvas实现环形进度条以下是展示案例的全部代码html<view class="wrapper"> <view class="canvasLine"> <canvas class="myCanvas" canva...

2019-10-12 09:48:50

Vue - 1px边框 & 二三倍图

vue-cli项目中采用stylus作为预处理器在src目录下建立common文件件base.styl@media (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5) .border-1px &::after -webkit-transform: scaleY(0...

2019-10-10 22:35:02

前端 - dpr

参考博客:http://www.woshipm.com/ucd/198774.html先理解以下几个概念:iphone8手机数据1.手机屏幕大小(英寸):屏幕对角线的距离,例如iphone8:4.7英寸2.屏幕分辨率(设备像素): 同样以iphone8举例,其屏幕分辨率为1334x750,也就是说屏幕纵向有1334个物理像素点,横向有750个物理像素点3.逻辑像素(CSS像...

2019-10-10 21:52:32

前端 - 字体图标制作

SVG 图标字体文件 控制大小颜色工具:icoMoon链接:https://icomoon.io/1.进入icoMoon App2.导入SVG图片3.逐一勾选图片4.生成字体文件5.配置,修改class的前缀6.下载7.vue-cli中使用字体图标src目录下建立common/fonts存放字体图标文件(将下载的fonts文件夹复制到...

2019-10-10 21:48:34

查看更多

勋章 我的勋章
  • 持之以恒
    持之以恒
    授予每个自然月内发布4篇或4篇以上原创或翻译IT博文的用户。不积跬步无以至千里,不积小流无以成江海,程序人生的精彩需要坚持不懈地积累!
  • 勤写标兵Lv3
    勤写标兵Lv3
    授予每个自然周发布7篇到8篇原创IT博文的用户。本勋章将于次周周三上午根据用户上周的博文发布情况由系统自动颁发。