- 博客(96)
- 收藏
- 关注
RSS订阅
原创 一段js实现复制文本内容到剪切板
直接上代码：<script type="text/javascript">function copyUrl2() { var Url2=document.getElementById("biao1").innerText; var oInput = document.createElement('input'); oInput.value =
2017-08-23 17:24:55
39362
19
原创 offsetWidth、offsetHeight、clientHeight、clientWidth、scrollHeight、scrollWidth详细对比
offsetHeight、offsetWidth其实就是元素在屏幕上所占的实际宽高（包括border、padding）时时clientHeight、clientWidth是 padding+conent-滚动条宽度，就拿上述例子来说clientHeight = padding + conent - 滚动条宽度时content高度就是我们设置的宽高，都是10093时，content高度是我们设置的宽高 - padding - border = 100 - 10 - 2 = 88。
2022-12-08 14:18:25
552
原创 getBoundingClientRect属性研究
getBoundingClientRect 返回 width、height和下图中的6个属性抓住一个核心点，就是height、width的值：所以：在看源码时，经常看到兼容性IE低版本的写法，了解即可，比如看popper.js源码时：
2022-12-06 22:23:24
540
原创 viewport视口的概念
概念详见 MDN，我摘出来对比了下，如下图：总结：只要记住，在手机浏览器中输入内容时弹出键盘，这是Visual Viewport高度变小了，而Layout viewport布局视口没变，概念就很容易理解了。用例子来理解概念。参考：https://developer.mozilla.org/en-US/docs/Glossary/Viewporthttps://developer.mozilla.org/en-US/docs/Glossary/Visual_Viewporthttps://developer.
2022-12-03 10:45:52
597
原创 重新认识box-sizing
摘自：https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing。,那么布局的时候，元素的宽高就是我们设置的宽高，省心方便。的定义,有了新的认识。
2022-11-29 15:26:56
382
原创 electron打包的exe程序，点击安装却执行了卸载的问题
electron打包的exe安装后，在没卸载的情况下，重新点击exe安装，会执行卸载，再点一次才是安装；针对这个问题，我注释了打包里的一个配置，就好了，如下。在window平台下。
2022-09-23 09:36:56
859
原创 wordpress自定义主题
找到 themes文件夹，位置新建一个目录存放主题文件，目录结构如下：index.phpstyle.css（放入一张自己的图，命名为）在style.css中定义主题相关信息，如下/**/回到后台刷新下，就可以看到我们主题了。
2022-08-19 10:56:26
298
原创 electron-vue升级electron到最新的版本后启动不起来，窗口一闪而过。
升级electron到最新的版本后启动不起来，窗口一闪而过。
2022-08-17 08:23:12
817
原创 vue如何将父组件所有的props传递给子组件
vue如何将父组件所有的props一次性传递给子组件<Child v-bind='$props'></Child>demo如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport"
2022-04-21 14:42:05
3607
1
原创 scrollTop详测
1. 如果一个元素不能被滚动（例如，它没有溢出，或者这个元素有一个"non-scrollable"属性）， scrollTop将被设置为0。2. 设置scrollTop的值小于0，scrollTop 被设为03. 如果设置了超出这个容器可滚动的值, scrollTop 会被设为最大值。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equi
2022-04-21 10:47:08
703
原创 Node sass 切换成Dart Sass
参照：链接注意：安装了sass后，sass-laoder的版本不能太高，否则会报Syntax Error: TypeError: this.getOptions is not a function我的版本对应关系如下：“sass”: “^1.49.9”,“sass-loader”: “^7.1.0”,
2022-03-17 11:21:47
877
原创 H5页面在ios上经常卡住怎么办
H5页面上用了position:fixed, 在ios上滑动页面到底部，再连点几下，页面就会卡住，刚测试过参考：https://segmentfault.com/q/1010000017416765
2021-12-08 17:51:59
857
原创 vue-element-admin中如何打断点
vue-element-admin中如何打断点1、vue.config.js中加一行 devtool: ‘source-map’,configureWebpack: { devtool: 'source-map', // provide the app's title in webpack's name field, so that // it can be accessed in index.html to inject the correct title. name:
2021-12-08 09:53:45
903
原创 如何开发 Vue 插件？
创建一个插件(组件)目录结构：在src目录下创建一个plugins目录，写我们的button组件// src/plugins/button/src/index.vue<template> <button class="create-btn primary"> <span> <slot></slot> </span> </button></
2021-10-21 16:48:46
161
原创 react-router小笔记
看了react-router-tutorial，轻松入门了react-router1、如何使用react-routerimport { Router, Route, hashHistory } from 'react-router'// render(<App/>, document.getElementById('app'))// Router也是一个组件render(( <Router history={hashHistory}> <Route pa
2021-10-19 14:35:51
59
原创 element-ui框架的el-dialog弹出框被遮罩层挡住了
如图：解决方案在el-dialog上加 :append-to-body="true",如下 <el-dialog :visible.sync="dialogUserVisible" title="修改密码" :append-to-body="true"> <el-form ref="dataForm" label-position="left" label-width="100px" > <el-form-item label="新密
2021-09-30 09:54:40
237
原创 Java方法重写的注意事项
public class Fu { void show() { System.out.println("Fu show"); } public void method() {}}public class Zi extends Fu{ public void show() { System.out.println("zi show"); } // void method() {} 编译出错 无修饰符 而父级的method是public权限，所有编写出错，无法覆盖}需要特别
2021-09-29 16:14:37
90
原创 cesium根据id选中实体
var viewer = new Cesium.Viewer('cesiumContainer');var scene = viewer.scene;var instance = new Cesium.GeometryInstance({ geometry : new Cesium.RectangleGeometry({ rectangle : Cesium.Rectangle.fromDegrees(-100.0, 30.0, -90.0, 40.0), vertexFormat
2021-09-08 17:20:00
3055
原创 cesium添加实体不被地形遮挡的参数设置
disableDepthTestDistance：指定从相机到禁用深度测试的距离,关于深度测试我们将在后面的文章中介绍到，由于深度测试的存在，我们的对象很多时候会被地形挡住，如下：被遮挡我们设置disableDepthTestDistance后，比如我们设置disableDepthTestDistance:50000，对象即可在高度50000下不再受深度的影响而显示...
2021-09-03 15:29:27
8970
原创 echarts中formatter配合rich使用
formatter:[ '{名称|...}', '...', ... ].join('\n'), rich:{ 名称:{ 对该名称|后的文本进行添加样式,且可以看成inline-block lineHeight: 10 width:10, align:'left|center|right', verticalAlign:'top|middle|bottom' 在lineHeight被决定后,竖直位置由verticalAlign来指定 backg
2021-08-17 17:14:47
2421
1
原创 echarts横坐标显示不全
在xAxis配合中加 interval: 0"xAxis":[ {"data":["2015-5-13","2015-5-14","2015-5-15","2015-5-16","2015-5-17","2015-5-18","2015-5-19","2015-5-20","2015-5-21","2015-5-22","2015-5-23","2015-5-24","2015-5-25"], "type":"category", "axisLabel":{ interval: 0 }}]
2021-08-06 14:23:13
172
原创 MVVM模式 VS MVP模式
MVVM模式 VS MVP模式MVP模式使用jquery操作DOM，就是经典的MVP模式：M：数据模型V：视图层P：控制层主要的关注点在P控制层，比如jquery通过响应视图层上用户的点击去请求ajax数据，再渲染更新视图层MVVM模式vue的MVVM模式：M：数据模型V：视图成VM：ViewModel层（vue通过虚拟dom技术、Object,defineProerty架构了这一层）因为是数据驱动的，主要关注点在数据模型M层，VM层监听到数据的变化，将数据映射到V视图层上。总结
2020-07-20 10:32:06
187
原创 Vue复用之Mixins混入
4.1 Mixins 混入1. 什么是Mixins当多个组件内部都写了同样的方法，如何将该方法提取出来，减少代码量呢？Vue实现方式如下：// define a mixin objectvar myMixin = { created: function () { this.hello() }, methods: { hello: function () { console.log('hello from mixin!') } }}// de
2020-07-07 15:50:42
1033
原创 ECMAScript2015文档概述
4、概述 OverviewECMAScript is an object-oriented programming language for performing computations and manipulating computational objects within a host environment.ECMAScript was originally designed to be used as a scripting language, but has become widely
2020-07-03 17:27:13
286
原创 Vue之过渡动画（一）
3.1、进入/离开 & 列表过渡1. OverviewVue provides a variety of ways to apply transition effects when items are inserted, updated, or removed from the DOM.On this page, we’ll only cover **entering, leaving, **and list transitions, but you can see the next se
2020-07-03 14:46:24
484
原创 Vue之处理边界情况
处理边界情况All the features on this page document the handling of edge cases，meaning unusual situations that sometimes require bending Vue’s rules a little. Note however, that they all have disadvantages or situations where they could be dangerous.特殊情况下的处理方
2020-07-01 16:31:16
614
原创 Vue插槽的那些事儿
2.4 插槽1. 插槽内容插槽可以包含任意的模板代码，包括html，甚至其他组件。如下：<slot></slot> 在渲染时将被替换成组件<text-document> 之间的所有内容完整代码2. 编译作用域插槽里插入的内容能访问的作用域例如下面的 doc.title 就是在访问同级作用域里的内容完整代码3. 插槽设置默认内容如果插槽里没有提供内容，可以设置默认渲染的内容：如下完整代码4. 具名插槽涉及多个插槽时，我们用name的属性来区分
2020-06-30 10:13:29
164
原创 ECMAScript 2015 Features - Babel
ECMAScript 2015 Features - Babel1. 箭头函数和thisUnlike functions, arrows share the same lexical _this _as their surrounding code. If an arrow is inside another function, it shares the "arguments" variable of its parent function.箭头函数中的this和arguments参数和普通函数
2020-06-29 20:07:18
176
原创 Vue自定义事件
1. 事件的命名规范组件上事件的命名推荐使用分隔符写法（** kebab-case **），如下面的add-size，因为html是大小写不敏感的，v-on后面跟的事件名都会转成小写的。用大写的会导致监听不到事件。<div id="dynamic-component-demo" class="demo"> <base-checkbox v-on:add-size="doSomething"></base-checkbox></div><
2020-06-24 15:42:36
609
原创 Vue之Props
1. Prop写法在DOM模板中使用时，要使用横线分隔，如下的 post-titleVue.component('blog-post', { // camelCase in JavaScript props: ['postTitle'], template: '<h3>{{ postTitle }}</h3>'})<!-- kebab-case in HTML --><blog-post post-title="hello!"><
2020-06-23 18:49:26
441
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人