- 博客(25)
- 收藏
- 关注
RSS订阅原创 如何修改原生radio的样式
废话不多说直接上代码: <label class="radio"> <input v-model="userInfoTemp.gender" type="radio" name="sex" value="2" /><i :class="[userInfoTemp.gender == 2 ? 'active' :
2022-02-24 15:01:26
621
原创 手把手教你开发一个vue插件
插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制——一般有下面几种：1、添加全局方法或者 property。如：vue-custom-element2、添加全局资源：指令/过滤器/过渡等。如 vue-touch3、通过全局混入来添加一些组件选项。如 vue-router4、添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现。5、一个库，提供自己的 API，同时提供上面提到的一个或多个功能。如 vue-router下面帮大家列举一下在书写使用插件时不常注
2021-12-13 14:36:58
725
原创 vue-quill富文本编辑器插入img标签时自定义属性
最近被quill.js这个富文本编辑器折磨了好几天，最终也算是完成需求。现描述一下这次遇到的需求时什么： 产品说需要在富文本编辑器加入一个图文混排的功能（图片需要支持缩放、并且图片与文字需要居中对齐）。之前只是文字并没有上传图片的功能。在拿到需求之后觉得很简单，就是在富文本编辑器新增一个图片上传功能。之后在开发的过程中还是遇到了好多问题。下面详细的给大家讲解一下。希望可以帮助到大家。1、首先需要解决的事图片上传以及缩放功能。实现步骤。 editorOption: { theme
2021-12-07 16:41:01
2824
2
原创 为何会产生1px像素问题。你了解过其原理吗？
问题描述：1px像素问题指的是在代码中写了1px，但是在某些手机的屏幕上就会看到的很粗。在探究该问题之前，我们需要了解几个概念：1、平时说的屏幕分辨率 xxx * xxxx，指的是屏幕的物理分辨率，简单来说就是屏幕上有多少个像素点。同样尺寸的屏幕，分辨率越高，图像展示的也就越清晰。2、设备独立像素:我们日常代码写的px，在设备缩放比例为100%的情况下，1px等于1个设备独立像素。在我们打开谷歌浏览器的手机模拟器的时候，看到的那些尺寸就是设备的独立像素。3、设备像素比：设备的物理像素/设备的独立像素
2021-12-02 10:58:06
1053
原创 ES6应该用到项目中的知识点
1、用let代替var, 防止变量提升，可以产生块级作用域，保证作用域安全。 声明常量最好用const声明。if (true) { console.log(x); // ReferenceError let x = 'hello';}// 用let声明，会报错，因为let声明的变量在声明前不可以调用。但是var没有这个限制，由于js的运行机制x会输出为undefined.所以产生了变量提升。2、使用字符串模版// badconst a = "foobar";const b = 'f
2021-11-29 15:51:27
87
原创 proxy简单实现观察者模式
观察订阅者模式实例const person = observable({ name: '张三', age: 20});function print() { console.log(`${person.name}, ${person.age}`)}observe(print);person.name = '李四';// 输出// 李四, 20```我们执行代码后发现，当给person对象赋值的时候会触发print函数。observe相当于声明一个观察者。当其里面内容改变的
2021-11-22 18:03:00
375
原创 JS的节流和防抖详解
JS的节流和防抖函数防抖(debounce)基本概念：在时间被触发n秒在执行回调，如果在这n秒内又被触发，则重新开始计时。未加防抖函数的例子function inputChange(content) { console.log("inputContent" + content); } let input = document.getElementById("unDebounce");input.addEventListener("keyup", function (e) {
2021-10-22 14:48:05
140
原创 你不知道的js构造函数
1. 创建对象的两种方式// 第一种方式var obj = { name:'sf'}// 第二种方式 通过构造函数function Obj(name){ this.name = name;}var obj = new Obj('sf');// 当我们new一个对象它发生了什么操作，以及构造函数中return的问题 // 第一步 首先创建一个空对象 var newobj = {}; // 第二步 把newobj实例对象的_proto__属性指向构造函数的proto
2021-06-30 09:45:06
97
原创 开始时间不能大于结束时间
<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <title>招管E通</title> <script type="text/javascript" src="/js/my_includes.js"></script> <script src="/teamwork/xmgl/project/com
2021-06-03 17:46:19
265
原创 企业站如何布局
以该图片为例。 底部设置固定定位，始终保持在浏览器底部，内容区域设置 一个padding-bottom:150px； 这样就可以使得高度较小的时候，不会出现内容被遮住的情况，
2021-05-27 15:02:09
57
原创 手把手教你封装一个 数字框组件
父组件： <input-number v-model="number" :min="min" :max="max"></input-number>子组件<template> <div> <input :value="currentnumber" @change="handleChange" /> <button v-on:keyup.up="handleUp" @click="hand
2021-04-19 09:12:30
160
4
原创 js数组find方法详解
find方法基础参数说明： arrary.find(function(item,index,arr),thisvalue);array:数组。 item:当前循环的项。 index:循环项的下标 。 arr：当前循环的数组。 thisvalue：如果传的话，在callbck函数中this为该值，不穿的话this为undefined。**方法特性： **会返回数组中符合条件的第一个值，在数组中找到的话则不会往下执行。 如果数组中没有符合条件的值则返回undefined **在find方法执
2021-04-13 10:50:34
31427
原创 在iframe下存储不上cookie，nginx配置iframe和主窗体同源
在非同源的iframe存储不上cookie需求描述: 公司的系统A需要嵌入公司系统B的页面。 系统A为C#程序，启动在IIS。在系统A中一个页面通过iframe嵌入系统B的页面，系统B是shiro的安全框架，前后端接口身份验证通过后端在response设置cookie存储上Jsessionid。 在谷歌浏览器中存在保护机制，当不同源的页面时无法在子页面存储cookie。导致在嵌套页面无法正常访问接口。解决方法： 在请求头加入p3p（可自行百度）没有成功。 最后通过测试发现如果是同源的界面则可以存
2021-04-08 11:28:50
3367
1
原创 前端如何实现多文件下载以及单文件下载
前端如何实现多文件下载以及单文件下载**单文件下载** let aLink = document.createElement('a') // 创建a标签 aLink.href = this.downloadurl; // 设置下载地址 aLink.download = this.downloadname;// 设置下载文件名 document.body.appendChild(aLink); aLink.click(); document.body.removeChild(aLink);
2021-04-08 11:10:06
409
原创 vue中计算属性和侦听属性
计算属性compute是多个输入一个输出。计算属性和方法不同的是计算属性会有缓存，当计算属性里面的变量不发生变化就会调用缓存而不是在执行一遍，例子：当你的table有一列工资。该列对应的值就可以是endSalary。var vm = new Vue({ el: '#demo', data: { basicSalary: 2000, tax: 200 }, com...
2020-03-26 10:19:42
113
原创 css响应式布局
css响应式布局究竟是怎么回事呢。废话不多说直接上代码 <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link media="(min-width: 500px)" rel="stylesheet" href="desktop.css"> <link med...
2020-02-22 13:21:33
105
原创 vue入口文件main.js解析
本人也是才学习Vue不久，当看到脚手架搭建出来的Vue项目不知道是怎样的一个执行过程。知道main.js是入口文件，但是不明白里面的内容是为何。下面直接上代码讲解。import Vue from 'vue';import App from './App.vue';import router from './router';import ElementUI from 'element-ui'...
2020-01-17 17:46:29
3017
原创 Vue基础学习
插值<div>{{ text }}</div> (1)text的值发生变化文本的值也会发生变化。数据的双向绑定。插值对应的属性为innerText。(2){{ *text }}这种写法不会有数据的实时更新。只会渲染一次。(3){{ }} 会默认把里面的值全部当作字符串来处理。如果是html片段可以使用{{{ }}} 这种形式。例子： <div&g...
2020-01-17 17:25:22
81
原创 MVC MVP MVVM框架
MVC：熟悉后端的开发人员肯定对MVC了如指掌。简单来说就是用户操作页面（view 层），请求传递到controller层经过一系列的的处理,模型层（model）会把数据渲染到页面。这样的一个流程。MVP：mvp框架中presenter完全把view和model进行了分离，主要的逻辑实在persenter中实现的。而且，Persenter与具体的view是没有直接关联的，而是通过定义好的接口...
2020-01-14 10:17:49
96
原创 vue组件为何要用export default
大家都熟知在es6中import可以导入已经导出的模块。export用来导出模块。但为什么在vue的代码里我们常见的有export default这种东西。并不是 export 模块名.他们究竟有什么区别呢。作用：‘ export 用来导出模块，Vue 的单文件组件通常需要导出一个对象，这个对象是 Vue 实例的选项对象，以便于在其它地方可以使用 import 引入。而 new Vue() 相...
2020-01-13 17:25:31
290
原创 js模块化
js模块化模块化分为三种方式：第一种：CommonJS :// 导入const moduleA = require(./moduleA);// 导出module.exports = moduleA.someFunc;第二种：AMD:// 定义一个模块define(‘module’,[‘dep’],function(dep){return exports;});// 导入...
2020-01-12 17:03:47
200
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人