- 博客(22)
- 收藏
- 关注
原创 使用媒体查询实现移动端适配
使用媒体查询实现移动端适配 <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,viewport-fit=cover,initial-scale=1.0"/>width=device-width : 让当前viewport 宽度等于设备宽度initial-scale=1.0 : 页面的初始缩放值为不缩放minimum-s
2021-11-09 15:19:16
430
原创 echarts点击事件的添加
获取echarts实例this.echarts.on('click',function(){ console.log('xxx')})这里点击事件只对数据记录 (例如:折线图的折点)触发,用户体验很不好可以使用 chart.getZr()方法this.echarts.off() ;//防止多次触发this.echarts.getZr().on('click',function(){ console.log('扩大了点击范围')})```...
2021-09-03 11:51:03
358
原创 wx小程序wxs的使用
创建.wxs 文件//例: util.wxs文件function indexOf(arr, value) { if (arr.indexOf(value) < 0) { return false; } else { return true; }}module.exports.indexOf = indexOf;在.wxml 引入<wxs src='./util.wxs' module='util'></wxs>
2021-09-03 11:33:42
663
原创 移动端开发兼容ios键盘不回弹的问题
移动端开发兼容ios键盘不回弹的问题<input @blur='inputBlur'> isIOS(){ var ua = navigator.userAgent.toLowerCase(); if( /(iPhone|iPad|iPod|iOS)/i.test(ua)){ //ios return true }else if(/Android/i.test(ua)){ //这里写else if是为了自己看 return false; }else{
2021-04-22 17:42:16
93
原创 流程图竖线css的实现
流程图竖线css的实现在开发过程中会经常遇到流程模块的功能 ,今天就来说下css如何实现如下图所示的左侧流程标记~<div class="os" style="width :100px ; height :100px ; border:1px solid black ;margin-top : 50px;" > <div class="orl"></div> </div>css样式.orl{ width: 3px; heig
2021-04-21 15:48:54
1470
原创 js 平滑滚动到某一位置
js平滑滚动window.scrollTo()//no.1 参数为坐标值//例 window.scrollTo(x,y)window.scrollTo(0,100)//x 为横坐标 y 为纵坐标//no.2 参数为option//例 window.scrollTo({top : x, left : y , behavior : 'xx'})window.scrollTo({top : 100 , left : 200 ; behavior : 'smooth'})//behavior
2021-04-16 15:45:11
157
原创 解决内容超出div 并且中英文切换换行问题
问题呈现如上图所示 会出现自动判断中文数字英文 导致换行 并且超出盒子 (这里盒子加了内边距)加入css代码word-wrap: break-word;word-break: break-all;
2021-03-02 13:11:11
284
原创 移动端开发js区别ios和安卓系统
```javascript isiOS() { //ios var isiOS; var u = navigator.userAgent; isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); return isiOS; },isAndroid(){ //安卓 var isAndroid; var u = navigator.userAgent; isAndroid = u.ind.
2021-02-25 17:20:25
409
原创 js对象无序排序解决
var arr=[]; for(var key in res){ arr.push(key) } arr = arr.sort() var newData={} for(var i in arr){ var...
2021-02-24 09:14:18
1448
原创 单行/多行文本省略号
单行定宽overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;
2021-02-23 09:02:20
105
转载 vue强制更新this.$forceUpdate()
vue强制更新this.$forceUpdate()调用强制更新方法this.$forceUpdate()会更新视图和数据,强制触发vue的update方法。对于深结构数据,比如,修改数组的长度为0 arr.length=0; 给对象添加新的属性 obj.newAttrbute=‘value’;等等。这样写是没有效果的,页面上的数据并不会同步更新,因为没有按照vue的规范去写,对于深层数据,需要使用$set方法,手动给数据绑定get set方法,实现数据的。当我们不想使用set方法,直接给对象添加属性
2021-02-09 10:58:29
7035
原创 禁止输入表情,评论区通用正则
禁止输入表情,评论区通用正则/[^\w\u4E00-\u9FA5,。- / ~;:?!、@‘’ ……“”~…\(\)()%\!\?,\.:-\’\"+]/g仅作为个人笔记使用~~
2021-02-09 10:55:59
228
转载 scrollIntoView()的用法
scrollIntoView()的用法scrollIntoView是一个与页面(容器)滚动相关的API(官方解释),该API只有boolean类型的参数能得到良好的支持(firefox 36+都支持),所以在这里只讨论参数Boolean类型的情况。调用方法为 element.scrollIntoView() 参数默认为true。参数为true时调用该函数,页面(或容器)发生滚动,使element的顶部与视图(容器)顶部对齐;参数为false时,使element的底部与视图(容器)底部对齐。TIPS
2021-02-09 10:52:56
1332
原创 回流和重构
回流与重绘 (回流必将引起重绘,而重绘不一定会引起回流)当render tree中的一部分(或全部)因为元素的规模尺寸,布局,隐藏等改变而需要重新构建。这就称为回流(reflow)。每个页面至少需要一次回流,就是在页面第一次加载的时候。在回流的时候,浏览器会使渲染树中受到影响的部分失效,并重新构造这部分渲染树,完成回流后,浏览器会重新绘制受影响的部分到屏幕中,该过程成为重绘。当render tree中的一些元素需要更新属性,而这些属性只是影响元素的外观,风格,而不会影响布局的,比
2020-11-25 08:19:46
716
原创 vue面试题汇总
vue面试题总结1 谈谈你对MVVM的理解,以及MVVM和MVC的区别?mvvmM : model 的缩写 存储数据的数据模型 dataV : views的缩写 负责将数据模型用ui组件展现出来 el 挂载点VM : view model的缩写 连接视图层和数据模型层 通过数据的双向绑定实例化的一个vue对象在mvvm架构下 view和model之间是不能直接联系的,而是通过viewmodel进行交互,model和viewmodel之间的交互是双向的,而view的数据变化会同
2020-11-15 17:55:00
311
原创 MVC和MVVM的区别
MVC和MVVM的区别?要想了解MVC和MVVM的区别,我们首先要知道mvc 、mvvm是什么:MVCM : model的缩写,它在这里指的是模型层,用来处理应用程序数据的逻辑部分,模型对象一般是来处理数据库中存取,V :view的缩写,在这里指视图层,用户界面渲染逻辑,通常...
2020-11-04 20:15:35
373
原创 vue初体验(个人学习笔记)
什么是vue?Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。vue的基本指令v-text更新元素的文本内容,不解析;<div v-text = "msg" id = "box"></div>...
2020-11-04 11:35:44
227
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人