weixin_45972345的博客

原创 vnm切换版本报错

提示是因为没有权限

原创 【ts的常用类型】

typescript

原创 package.json文件中，^和~的区别

package.json文件中，^和~的区别

原创 微信小程序dialog超出不滚动问题

有时候会碰到，微信小程序的dialog，里面的内容已经很长了，但是就是不会滚动，今天记录一下，亲测有效

转载 webstorm中如何使用less更新wxss

webstorm使用less更新wxss

原创 vue 中 scrollIntoView

vue 中使用 scrollIntoView<div class="item_type" :id="item.id"> <span >{{item.label}}</span></div>document.getElementById(item.id).scrollIntoView()scrollIntoView({ behavior：auto //定义动画过渡效果"auto"或 "smooth" 之一。默认为 "auto"。 block

原创 css ::after ::before 画*号

.required { position: relative; display: inline-flex; align-items: center; margin-bottom: 16rpx;}.required::after { display: inline-block; margin-left: 6rpx; color: #FA5753; font-size: 30rpx; line-height: 1; content: '*';}

原创 微信小程序 父组件样式修改子组件样式

微信小程序 父组件样式修改子组件样式//在components中使用options: { styleIsolation: 'apply-shared'},链接: 官方文档

转载 js 判断数组内元素是否全相同

js 判断数组内元素是否全相同 function isAllEqual(array) { if (array.length > 0) { return !array.some(function (value, index) { return value !== array[0]; }); } else { return true; } }...

原创 Vue+elementUI下拉框自定义颜色选择器

Vue+elementUI下拉框自定义颜色选择器定义子组件父组件引入引入组件声明组件页面使用定义子组件<template> <div> <el-select ref="colorSelect" placeholder="" clearable v-model="myColor" style="width: 100%" @change="handleChange"> <el-option v-for="item in col

原创 element ui日期选择器:picker-options=“pickerOptions“设置禁用状态

element ui日期选择器:picker-options="pickerOptions"设置禁用状态效果图代码效果图代码<el-form-item label="延期时间" prop="delayTime" slot="delayTime"> <el-date-picker style="width: 400px;" v-model="formData.delayTime" :picker-opt

原创 element-ui 中dialog居中

element-ui 中dialog居中 ::v-deep .el-dialog{ display: flex; flex-direction: column; margin:0 !important; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); /*height:600px;*/ max-height:calc(100% - 30px);

原创 小程序生成海报并保存到相册

小程序生成海报并保存到相册1.安装2.配置3.引入4.使用4.1：wxss文件4.2：js文件* 图片必须是本地的不能是base64位的1.安装# npm npm i wxa-plugin-canvas -S --production # yarn yarn add wxa-plugin-canvas --production2.配置"usingComponents": { "poster": "wxa-plugin-canvas/poster" },3.引入imp

原创 小程序设置过滤器 wxs

小程序设置过滤器utils中新建一个filters.wxs注意这里不能使用es6语法，所以抛出时 使用 A：A小程序wxss文件中不能使用JSON.parsevar status = function (status) { if (status == 0) { return '关' } else if (status == 1) { return '开' }}var limit = function (array, length) { return array.

原创 防止flex:1挤压

flex防止flex:1挤压flex-shrink: 0;设置flex字母数字换行word-break: break-all;

原创 构造函数和原型 （二）

构造函数和原型 （二）利用原型对象扩展内置对象方法二级目录三级目录利用原型对象扩展内置对象方法Array.prototype.sum=function(){ var sum=0; //this 为调用者 for(var i = 0;i<this.length;i++){ sum+=this[i] } return sum}var arr=[1,2,3]console.log(arr.sum());//6注意：数组二级目录三级目录...

原创 构造函数和原型 （一）

构造函数和原型构造函数实例成员以及静态成员实例成员静态成员构造函数的问题构造函数的问题对象原型 __ proto__constructor 构造函数构造函数 实例 原型对象三者之间的关系构造函数构造函数 是一种特殊的函数，主要用来初始化对象，即为对象成员变量赋初始值，他总与new一起使用，我们可以把对象中一些公共的属性和方法抽离出来，然后封装到这个函数里面在js中，使用构造函数时，要注意以下两点● 构造函数用于创建某一类对象，其首字母要大写● 构造函数要和new一起使用才有意义n

原创 面向对象 tab栏切换

面向对象 tab栏切换需求介绍抽取对象：tab对象项目分析项目初始化切换添加删除编辑话不多说上代码HTMLJS在B站看到的学习视频 传送门首先看一下效果需求介绍点击tab栏，实现切换效果点击+号，实现添加tab项和内容项点击X号，可以删除当前的tab项和内容项点击tab项文字或者内容，可以修改里面的文字抽取对象：tab对象该对象具有切换功能该对象具有添加功能该对象具有修改功能该对象具有删除功能项目分析项目初始化应该让所有的li section X 已经添加按钮

原创 面向对象编程简单介绍

面向对象编程介绍面向对象编程介绍1 面向对象编程 oop ( object Orinted programming)面向对象的三个特征2 类和对象对象类 class类 constructor 构造函数3 类的继承类继承 extends和super关键字super调用父类普通函数以及继承中属性查找的规则4 使用类的两个注意点类里面的注意this指向问题面向对象编程介绍1 面向对象编程 oop ( object Orinted programming)面向对象是把事物分解成成一个个对象，然后由对象

原创 Nuxt.js asyncData 多请求

Nuxt.js asyncData 发送请求Nuxt.js asyncData 发送请求单次多次Nuxt.js asyncData 发送请求单次<template> <div> <h1>asyncData</h1> {{name}} {{info}} {{info.name}} </div></template><script>import axios from 'axi

原创 element UI 封装table组件

tableWrapper.js<template> <div> <el-table :height="settings.height" v-loading="settings.isLoading" :header-cell-style="{background:'#FAFAFA',color:'rgba(0,0,0,0.85)',height:'54px'}" @selection-change="e => h

原创 Vue实现ElementUI中Message组件

Vue实现Element-ui中Message组件首先新建一个plugin文件夹message.jsimport Vue from 'vue'import messageComponent from './message.vue'let vm;const getInstance = () => { //单例模式 防止生成多个dom if (!vm) { vm = new Vue({ render: h => h(messageComponent)

原创 vue.js 基础

vue.js基础标签中的新属性v-bind对象语法数组语法添加图片SRC地址v-on指令v-forv-if/v-else/v-showv-modelv-htmlv-text三级目录计算属性组件生命周期标签中的新属性v-bindv-bind：我们能将 data 中的值绑定到当前属性中，可简写为 :<a :href="url">a标签</a><p :class="pClass">p标签</p>对象语法<h1 v-bind:class="{'

原创 js中null和undefined的区别

null和undefined的区别概述nullundefined不同点导图概述null和undefined都可以表示没有，null是 JavaScript 基本类型 之一，null可以表示为尚未创建的对象，null表示空值，即该处的值现在为空var a=null;//a已经存在了，只是没有类型或者值undefined表示未定义如果方法中的变量没有被赋值，则返回undefinedvar a;console.log(a,'a');//undefined afunction tes

原创 el-select的v-model的没有及时更新页面的值

el-select的v-model的change事件已经显示值变了，但是下拉框没及时更新 <el-select v-model="value" placeholder="请选择" @change="handleChange" > <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> &l

原创 js求两数之和

输入：nums = [2,7,11,15], target = 9输出：[0,1]解释：因为 nums[0] + nums[1] == 9 ，返回 [0, 1] 。方法一：var twoSum = function(nums, target) { for (let i = 0; i < nums.length; i++) { for (let j = i + 1; j < nums.length; j++) { if (nums[i] +

原创 webstorm直接运行js

第一种：直接右键第二种：选中文件夹右键结果

原创 vue事件修饰符

vue事件修饰符详解代码展示思维导图详解.stop 阻止冒泡，相当于相当于js中的event.stopPropagation冒泡事件：父子组件都有点击事件，点击子组件，就会触发父组件上的点击事件.prevent 阻止默认事件，相当于js的event.preventDefault()，比如a标签点击跳转.capture 事件捕获 捕获事件：父子组件都有点击事件，点击子节点，就会触发从外至内 父节点->子节点的点击事件.self 只当在 event.target 是当.

原创 vue中slot插槽

vue中的slot为什么要使用slotslot的基本用法为什么要使用slot说道插槽，我们首先想到的会是电脑的usb插口，它既可以插手机，键盘，鼠标，还可以插盘，一个小小的插口，可以接收不同的值，就像solt标签一样比如，我们经常看到购物车的导航丽娜，他们的内容虽然不一样，但是我们可以看出来他们的结构都是一样的，或者说，当父组件引入子组件后，我们不想单一的用一种标签来实现，这个时候我们都可以用slot来实现slot的基本用法//父组件 <div class="wrapper">

原创 vue父子组件

父访问子<div> <child ref='child'></child></div>this.

原创 实现promise以及promise.all

实现promise以及promise.all这篇文章，主要是根据promise/A+里面的规范写的，class DesignPromise { constructor(handleFunc) { this.state = 'pending' this.value = undefined this.fulfilledList = [] handleFunc(this.triggerResolve.bind(this)) } triggerResolve(val)

原创 element ui合并表格

element ui合并表格这是官网上的效果，传送门这是我合并之后 的样子，首先要保证你的数据是一条一条的，然后要合并的地方得有一个地方是用于区分到底合并不合并的，上代码<el-table :data="listData" :span-method="objectSpanMethod" class="tableArea" style="width: 100%" > <el-table-column p

原创 git指令

git指令git add . // 添加 全部匹配添加 //工作区到暂存区git status // 查看文件状态 ,红色说明修改过git commit -m ‘添加备注’ // 提交本地仓库git checkout -b 分支名 // 创建分支git checkout 分支 // 切换分支git push origin development:development 本地分支送到远程上git log // 查看所有的提交日志git branch -v

原创 父盒子有高度，子盒子没撑起来咋办

父盒子中，被内容撑起来高度后，另一个子元素没有继承到高度的时候怎么办？因为内容是不固定的，所以当时想的是既然文字部分能把父元素撑起来，那么橙色的子盒子高度百分百了之后，是可以显示出来的，但是，我发现不是这样给了高度百分百，他竟然不显示，这个时候想到用弹性盒，给父元素设置弹性盒，在设置一下子元素的排列方式，一切完美display: flex;flex-direction: row;...

原创 vue多层筛选

原创 递归实现深拷贝

**递归实现对象中有引用数据类型的深拷贝**const obj6 = {data: [{name: undefined,age: ‘小白’,result: {date: ‘2019’,time: undefined,}},{name: ‘小花’,age: ‘小白’,result: {date: ‘2019’,time: 5000,}},]} fun...