PrisonersDilemma的博客

原创 vue 放大镜（简易）

【代码】vue 放大镜（简易）

原创 TS 第二章：面向对象

第二章：面向对象面向对象是程序中一个非常重要的思想，它被很多同学理解成了一个比较难，比较深奥的问题，其实不然。面向对象很简单，简而言之就是程序之中所有的操作都需要通过对象来完成。举例来说：操作浏览器要使用window对象操作网页要使用document对象操作控制台要使用console对象一切操作都要通过对象，也就是所谓的面向对象，那么对象到底是什么呢？这就要先说到程序是什么，计算机程序的本质就是对现实事物的抽象，抽象的反义词是具体，比如：照片是对一个具体的人的抽象，汽车模型是对具体汽车

原创 TS 第一章：快速入门

第一章 快速入门0、TypeScript简介TypeScript是JavaScript的超集。它对JS进行了扩展，向JS中引入了类型的概念，并添加了许多新的特性。TS代码需要通过编译器编译为JS，然后再交由JS解析器执行。TS完全兼容JS，换言之，任何的JS代码都可以直接当成JS使用。相较于JS而言，TS拥有了静态类型，更加严格的语法，更强大的功能；TS可以在代码执行前就完成代码的检查，减小了运行时异常的出现的几率；TS代码可以编译为任意版本的JS代码，可有效解决不同JS运行环境的兼容问题；同

原创 谷歌浏览器通过设置快捷方式实现解决跨域问题

版本号小于 v49 的设置：新建谷歌浏览器快捷方式右击，打开属性，快捷方式在目标框里在后面添加 --disable-web-security点击应用，并打开chrome浏览器。如果浏览器出现提示 你使用的是不受支持的命令标记 --disable-web-security。稳定和安全性会有所下降。 ，那么说明配置成功版本号大于 v49 的设置：C盘新建文件夹 chromedata新建谷歌浏览器快捷方式右击，打开属性，快捷方式在目标框里在后面添加 --disable-web-securi

原创 element开发 - table组件中实现多图片预览

业务需求：表格中有一组图片，每次点击图片，预览该图片。开发问题：点击表格中的任意一张图片，预览图都是从第一张图片，开始预览。解决方案：preview-src-list 绑定函数返回新数组。<el-table :data="list" @current-change="handleCurrentChange"> <!-- ...... --> <el-table-column label="图片"> <template slot-scope="scope

原创 vue开发SPA中，路由切换时，子组件间滚动行为相互影响的解决办法

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...

原创 echarts示例1

运行网址： https://www.echartsjs.com/examples/zh/editor.html代码： var option = { title : { text: '某地区蒸发量和降水量', subtext: '纯属虚构' }, tooltip : { trigger: 'axis' ...

原创 关于使用a标签下载txt的问题解决

function download(text, title) { let a = document.createElement('a') a.href = 'data:text/plain;charset=utf-8,' + encodeURIComponent(text) a.download = title a.cli...

原创 关于使用a标签下载图片视频的问题解决

function download(url, title) { let a = document.createElement('a') a.href = url a.download = title a.click() }如果想使用参数 title 重命名下载，必须遵循同源策略，如果跨域了，就按 url 末...

原创 element开发 - 多个upload组件绑定同一函数的解决方法

参考网上大神，终于可以少写几个函数了。涉及到闭包。html： <el-form :model="form" label-width="160px"> <el-form-item label="商品封面" style="height: 90px;"> <el-upload :action="uploadUrl"...

原创 Vue CLI 3中启动cli服务参数说明

使用命令在一个 Vue CLI 项目中，@vue/cli-service 安装了一个名为 vue-cli-service 的命令。你可以在 npm scripts 中以 vue-cli-service、或者从终端中以 ./node_modules/.bin/vue-cli-service 访问这个命令。这是你使用默认 preset 的项目的 package.json： { "scrip...

原创 element开发 - 表格组件设置单元格样式

原创 uni-app踩坑 - gitignore忽略提交unpackage文件夹至git仓库

首先命令行新建.gitignore文件。touch .gitignore然后记事本打开。复制粘贴以下：node_modules/.projectunpackage/.DS_Store也可以直接使用uni-app的hello-uniapp模板中的.gitignore文件，仓库地址是：DCloud/hello-uniapp/.gitignore注意：如果之前就已...

原创 uni-app踩坑 - 解决ios系统下微信公众号H5页面软键盘弹出后页面整体上移

话不多说，贴代码：

原创 uni-app踩坑 - 模态框modal禁止滑动、禁止点击

话不多说，贴代码：<view class="my-modal" @touchmove.stop.prevent="preventHandler"> <view>...</view></view>export default { methods: { preventHandler() { return } }}...

原创 uni-app踩坑 - 官方form组件 表单提交后实现手动清空数据

官方属性说明如下图：form表单提交后，没有清空表单数据。现在要实现不通过按钮点击触发@reset=“formReset”，手动触发清空事件。html：<form @submit="formSubmit" @reset="formReset"> <view> <button form-type="submit">Submit&l...

原创 uni-app踩坑 - 官方picker组件 Invalid prop: custom validator check failed for prop "value".

官方属性说明如下图：废话不多说，bug看图：想实现的效果是多级选择器，上级picker更新后，下级picker全部置空。于是循环处理，给value赋值空字符串。然后就报错了。忙乎了半天才想起value值必须为Number类型。怎么办？<picker mode="selector" @change="pickerChange($event)" :value="Numbe...

原创 vue学习大纲知识点总结之三

Vue调试工具vue-devtools的安装步骤和使用Vue.js devtools - 科学安装方式 - 推荐过滤器概念：Vue.js 允许你自定义过滤器，可被用作一些常见的文本格式化。过滤器可以用在两个地方：mustache 插值和 v-bind 表达式。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符指示；私有过滤器HTML元素：<td>{{i...

原创 vue学习大纲知识点总结之四

键盘修饰符以及自定义键盘修饰符1.x中自定义键盘修饰符【了解即可】Vue.directive('on').keyCodes.f2 = 113;2.x中自定义键盘修饰符通过Vue.config.keyCodes.名称 = 按键值来自定义案件修饰符的别名：Vue.config.keyCodes.f2 = 113;使用自定义的按键修饰符：<input type="te...

原创 vue学习大纲知识点总计之二

在Vue中使用样式使用class样式数组<h1 :class="['red', 'thin']">这是一个H1</h1>数组中使用三元表达式<h1 :class="['red', 'thin', isactive?'active':'']">这是一个邪恶的H1</h1>数组中嵌套对象<h1 :class="['re...

原创 vue学习大纲知识点总结之一

什么是Vue.jsVue.js 是目前最火的一个前端框架，React是最流行的一个前端框架（React除了开发网站，还可以开发手机App， Vue语法也是可以用于进行手机App开发的，需要借助于Weex）Vue.js 是前端的主流框架之一，和Angular.js、React.js 一起，并成为前端三大主流框架！Vue.js 是一套构建用户界面的框架，只关注视图层，它不仅易于上手，还便于与第...

转载 CSDN-markdown编辑器

这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Ma...

原创 jQuery插件 - elevateZoom放大镜

前言：elevateZoom是一个图片放大插件，支持多种放大方式，强大且简单。用法：单张图片实现放大效果：多张缩略图实现切换放大效果：参数:参数默认值允许值描述responsivefalsetrue, false设置为true时启用响应式scrollZoomfalsetrue, false设置为true时启动鼠标滚轮进行缩放loading...

原创 关于node.js安装express成功后无法执行express命令的解决方法

安装express,使用熟悉的npm install -g express命令安装,但是,安装成功之后居然提示express不是内部或外部命令.为什么会这样子呢?原因是安装最新版本的express，缺少了几个文件，而且，最新版本的express命令行功能已经转移到模块express-generetor，需要单独安装。使用express的办法有两种：第一种是：卸载: npm uninstal...

原创 获取jQuery对象的第一个子元素

console.log($('.pagebtn').eq(0)); console.log($('.pagebtn').get(0)); $('ul').find('li:first'); $('ul li:first');

原创 CSS的扩展 - Sass

文章目录前言：语法：变量嵌套Import导入Mixins继承Extend/InheritanceOperators 操作符引用父选择器&Nested Properties嵌套属性Comments注释前言：Sass是CSS的扩展，为基本语言增添了更为强大的特性。 它允许您使用变量，嵌套规则，混合，内联导入等等，并提供sass,scss两种的语法选择，具有完全CSS兼容的语法,Sass可以...

原创 JS实现滚动条滚动到指定位置时，更换标签样式实现固定效果

$(window).on('scroll',()=>{ let $fixedheader = $('header'); // fixed容器 // console.log(fixedheader); var wintop=$(window).scrollTop(); // 已滚动卷去的高度 // console.log(wintop); let winHeight = ...

原创 CSS伪类与伪元素

CSS伪类与伪元素

原创 JS中修改原型链继承

学习JS的继承需要对JS的原型链有一定了解：https://blog.csdn.net/PrisonersDilemma/article/details/89318495之前学习了原型链，这里对原型链的继承总结一下。文章目录 functionAnimal(){ this.name="this animal"; } Animal.prototype.eat= function (f...

原创 JS中art-template模板使用子模板

var mySwiper = new Swiper(’.swiper-container’, {spaceBetween: 30,centeredSlides: true,loop: true, //循环播放autoplay: { //播放时间间隔delay: 5000,disableOnInteraction: false,},pagination: {el: ‘.swiper...

原创 JS中art-template模板使用过滤器

html有个特点：某些小数会变成无限小数。比如1.05，可能显示为1.049999999999……在javascript中可以使用.toFixed(value);等方法，进行四舍五入处理，保留固定的小数位数。但是，art-template模板进行渲染就不支持在模板中直接使用方法。这时就需要用到art-template模板的过滤器。 <div class="box"></...

原创 JS中art-template模板使用if判断

JS代码： // json数据 var json=[ { "id": 1, "good_sign": 2, "good_img": "http://dummyimage.com/ee79f2/79f2cb.png&text=商品\n" }, { "id": 2, "good_sign": 1, "good_img": "http://du...

原创 JS中art-template模板使用循环嵌套

JS代码：// json数据var json=[ { "ad_img": "http://dummyimage.com/1180x240/79f28b/f27989.png&text=广告图", "good": [ {"good_img": "http://dummyimage.com/690x660/f2a979/8679f2.png&...

原创 CSS小案例：开关

HTML代码： <h4>开关</h4> <label class="switch"><input type="checkbox" name="switch" checked><span></span></label>CSS代码： .switch {cursor: pointer;} .switch sp...

原创 HTML、CSS、javascript中单行注释和多行注释

HTML注释： <!--单行注释--> <!-- 多行注释 多行注释 多行注释 -->css注释： /*单行注释*/ /* 多行注释 多行注释 多行注释 */JS注释：//单行注释/* 多行注释 多行注释 多行注释*/...

原创 Git常用方法

文章目录简易的命令行入门教程:Git全局设置:创建git仓库并托管:已有仓库直接托管转移仓库简易的命令行入门教程:Git全局设置:git config --global user.name “”git config --global user.email "[email protected]"创建git仓库并托管:mkdir oldcd oldgit inittouch README.mdgi...

原创 JS数组去重的方法总结

文章目录利用双层for循环去重 一利用双层for循环去重 二利用indexOf()去重利用对象类型实现去重利用Set对象实现去重利用reduce()实现去重利用双层for循环去重 一最简单的思路，但去重效率低。思路：外层循环的索引为i的值和内层循环的索引为j的值比较，重复的去除，最后返回数组。 function distinct(arr){ for(var i=0;i<arr.l...

原创 GET和POST两种基本请求方法的区别

最早接触GET和POST是在学习Html中的form标签。 <form name="login" method="get" action="#" target="_blank"> <input type="text" value=""/> </form>在Ajax学习中无可避免再次遇见。所以做个浅显的总结。相同点：GET和POST是HTTP协议中...

原创 ajax.readyState（HTTP 状态值）与ajax.status（HTTP 状态码）的数值具体意义

ajax.readyState（HTTP 状态值）0 －（未初始化）还没有调用send()方法1 －: （载入）已调用send()方法，正在发送请求2 － （载入完成）send()方法执行完成，已经接收到全部响应内容3 － （交互）正在解析响应内容4 － （完成）响应内容解析完成，可以在客户端调用了ajax.status（HTTP 状态码）1XX－请求收到，继续处理2XX－操作成功...

原创 Ajax简介

Ajax：全称是 Asynchronous JavaScript And XML，中文翻译为异步的JavaScript和XML，是一种用于创建快速动态网页的技术。不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行。注意：Ajax不是新的编程语言！！！而是一种使用现有标准的新方法！！！为了在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页内容。由 Jesse Ja...