- 博客(107)
- 收藏
- 关注
RSS订阅原创 typescript知识点
1.typescript开发环境搭建（1）安装node的运行环境 node+npm（2）全局安装typescriptnpm install typescript -g（3）建立项目目录和编译ts文件建立文件夹，demo1.tsfunction pang(){ let web: string='Hello World' console.log(web)}pang()因为 Node 不能直接运行TypeScript文件，需要用tsc demo1.ts转换，转换完成后t
2022-01-06 14:33:19
528
原创 webpack总结
什么是WebPack？打包：可以把多个Javascript文件打包成一个文件，减少服务器压力和下载带宽。 转换：把拓展语言转换成为普通的JavaScript，让浏览器顺利运行。 优化：前端变的越来越复杂后，性能也会遇到问题，而WebPack也开始肩负起了优化和提升性能的责任。...
2021-12-31 17:40:29
371
原创 ES6其它
JSON标准的JSON数组格式：（跟普通的JSON对比是在最后多了一个length属性）let json = { '0': 'jspang', '1': '技术胖', '2': '大胖逼逼叨', length:3}只要是这种特殊的json格式都可以轻松使用ES6的语法转变成数组Array.from(xxx)let json = { '0': 'jspang', '1': '技术胖', '2': '大胖逼逼叨', length:3}.
2021-12-30 15:38:54
266
原创 前端精确还原设计稿，从psd到html
动态生成的元素做事件委托 $('.select ul').on('mouseenter',"li",function(e){ $(this).css({'backgroundColor':'#E8F3FF','font-size':'18px'}); }); $('.select ul').on('mouseout',"li",function(e){ ...
2021-07-16 16:23:49
961
转载 vue双向绑定原理
当你把一个普通的 JavaScript 对象传入 Vue 实例作为data选项，Vue 将遍历此对象所有的 property，并使用Object.defineProperty把这些 property 全部转为getter/setter。在 property 被访问和修改时通知变更。...
2021-07-12 15:51:08
289
原创 vue dialog及detail封装
1.父组件 <!-- 弹窗, 新增 / 修改 --> <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> // 引入 import mixinViewModule from '@/mixins/view-module' import AddOrUpdate from './ad
2021-07-05 15:31:03
732
原创 git创建分支develop，并合并到master
1.列出当前远端库的分支情况：git branch2.新建并切换当该分支：git checkout -b develop相当于：git branch developgit checkout develop3.在当前分支下进行修改项目：git add .git commit -m 'update'可有：git diff develop master4.提交变更（分支）git pull origin developgit push -u origin
2021-05-14 11:52:12
2271
原创 vue生命周期
创建前/后：在beforeCreated阶段：vue实例的挂载元素$el和数据对象data都为undefined，还未初始化；在created阶段，vue实例的数据对象data有了，$el还没有。载入前/后：在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换；在mounted阶段，vue实例挂载完成，data.message成功渲染。更新前/后：当data变化时，会触发beforeUpdate和updated方法.
2021-04-02 16:01:44
143
原创 vue中el，render，template，及基础知识点
el的作用：用于声明vue实例的挂载目标Render 函数是 Vue2.x 新增的一个函数、主要用来提升节点的性能，它是基于 JavaScript 计算。使用 Render 函数将 Template 里面的节点解析成虚拟的 Dom在底层的实现上，Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统，Vue 能够智能地计算出最少需要重新渲染多少组件，并把 DOM 操作次数减到最少...
2021-04-02 16:00:50
916
原创 小程序概念理解
小程序启动之后，在app.js定义的App实例的onLaunch回调会被执行:整个小程序只有一个 App 实例，是全部页面共享的，更多的事件回调参考文档应用生命周期：小程序的一个页面是怎么写的（1）先根据logs.json配置生成一个界面，顶部的颜色和文字你都可以在这个json文件里边定义好（2）紧接着客户端就会装载这个页面的WXML结构和WXSS样式。（3）最后客户端会装载logs.jsPage({ data: { // 参与页面渲染的...
2021-04-02 11:14:09
138
转载 promise
在JavaScript的世界中，所有代码都是单线程执行的。单线程-----导致JavaScript的所有网络操作，浏览器事件，都必须是异步执行（异步执行可以用回调函数实现）异步操作会在将来的某个时间点触发一个函数调用1.什么是promise ES6 异步编程的一种解决方案，比传统的方案（回调函数和事件）更加的合理和强大 好处 异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数 promise可以解决异步的问题，本身不能说promise是异步的 functi
2021-03-26 16:52:30
113
原创 小程序 vant-weapp组件库安装
一 确保npm和node安装成功二 微信开发者工具新建一个项目（勾选不使用云开发）三 微信开发者工具中右键：在外部终端窗口中打开四 执行1.npm init在根目录下一直回车，此时会多一个package.json文件2.npm i @vant/weapp -S --production使用这种安装方法，路径可以直接从官方文档复制，无需修改五修改 app.json将 app.json 中的"style": "v2"去除，小程序的新版基础组件强行加上了许多样式，难以覆盖，...
2020-11-13 14:15:12
264
1
原创 小程序vant weapp 0.X与1.6.1(1.5.2)对比少的组件
vant weapp 0.X与1.6.1(1.5.2)对比少的有：基础组件少了：image图片表单组件少了：Calendar日历 + Uploader文件上传反馈组件少了：DropdownMenu 下拉菜单 + Overlay 遮罩层 + ShareSheet 分享面板展示组件少了：Circle 环形进度条 + CountDown 倒计时 + Divider 分割线 + Empty 空状态 + Skeleton 骨架屏 + Sticky 粘性布局导航组件少了：Grid 宫格 +
2020-11-13 10:13:51
321
原创 微信小程序组件间传值
一. 微信小程序父组件向子组件传值1.父组件可以直接传参或者使用数据绑定向子组件动态传递数据组件在父组件内写法：<view> <!-- 以下是对一个自定义组件的引用 --> <my-component inner-text="Some text" numberA='5' numberB='4' prop-a="{{dataFieldA}}"></my-component></view>2.子组件Component({
2020-11-05 17:48:34
6167
原创 微信小程序自定义组件
使用：（1）我们可以将页面内的功能模块抽象成自定义组件，以便在不同的页面中重复使用；（2）也可以将复杂的页面拆分成多个低耦合的模块，有助于代码维护。自定义组件在使用时与基础组件非常相似。...
2020-11-05 09:46:07
166
原创 理清方法findIndex()，find(), 与filter()等
（1）findIndex()方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置获取数组中年龄大于等于 18 的第一个元素索引位置var ages = [3, 10, 18, 20]; function checkAdult(age) { return age >= 18;} function myFunction() { document.getElementById("demo").innerHTML = ages.findIndex(checkAdul
2020-09-28 17:31:19
267
原创 computed，watch理解
二次封装的优势及意义（1）有利于紧密贴合业务，提高开发效率（2）封装的组件越来越多，业务能得到实际的解决（3）提高开发者组件设计能力
2020-09-17 16:16:40
378
原创 BFC + 浮动
清除浮动：由于子元素浮动带来父元素高度塌陷（1）给父元素追加clearfix类.clearfix:after { content: ''; display: block; height: 0; font-size: 0; clear: both; visibility: hidden;}或 content:""; display:table; clear:both;（2）overflow:hidd...
2020-09-05 10:49:26
95
原创 设备像素比+图片高清显示+移动适配
一、设备像素比（device pixel ratio）在前端开发之前，我们会有一个psd文件，称之为视觉稿。对于移动端开发而言，为了做到页面高清的效果，视觉稿的规范往往会遵循以下两点：首先，选取一款手机的屏幕宽高作为基准(以前是iphone4的320×480，现在更多的是iphone6的375×667)。 对于retina屏幕(如: dpr=2)，为了达到高清效果，视觉稿的画布大小会是基准的2倍，也就是说像素点个数是原来的4倍（对iphone6而言：原先的375×667，就会变成750×1334）
2020-09-04 14:31:05
291
原创 左边固定，右边自适应
html结构如下：右边一定不能设width:100%;一、左边浮动，右边margin-left:200px;二、父元素相对定位，左边绝对定位，并且固定宽度200px，右边margin-left:200px;三、弹性盒子；父元素display:flex;左边固定200px;右边flex:1...
2020-08-25 11:18:29
215
原创 vue中ref的作用
1.基本用法：本页面获取DOM元素2.ref还可以拿到子组件中的data和去调用子组件中的方法获取子组件中的data子组件父组件调用子组件的方法子组件父组件
2020-08-24 16:07:46
185
原创 vue ElementUI重置dialog + 表单相关
(1)template中（引入组件的dialog 或 直接dialog均可） <!-- 运费 --> <div class="feeDialog"> <el-dialog v-if="reFreshShowModeratorFee" width="1200px" :visible.sync="showModeratorFee"> <div class="fee_dialog">
2020-07-02 17:59:35
1068
原创 vue elemengUI 省市区三级联动
（1）template中 <el-form-item label="公司注册地址"> <el-select v-model="ruleForm.province_id" style="width:150px;margin: 0px 10px 0 0;" @change="changeCity(1)"> <el-option v-for="(province,index) in provinceLis..
2020-07-02 16:32:30
212
原创 vue项目 ie11 浏览器报 Promise 未定义的错误
报错：{description:"“Promise”未定义",message:"“Promise”未定义",name:"ReferenceEr...",number:-2146823279,stack:"ReferenceEr..."}解决办法1. npm install babel-polyfill --save2. 在main.js中import "babel-polyfill"3. 如果使用了vuex，则在vuex的index.js文件中也要...
2020-06-22 14:27:47
1043
原创 vue elementui form表单自定义必填*
<span slot="label"><span style="color: #F56C6C;margin-right: 3px;">*</span>使用版谷</span>
2020-04-17 17:20:26
1898
转载 forEach与map的区别（有无返回值）
共同点（1）只能遍历数组（2）都是循环遍历数组中的每一项（3）每一次执行匿名函数都支持三个参数，数组中的当前项item，当前项的索引index，原始数组input（4）匿名函数中的this都是指window1.forEach没有返回值arr[].forEach(function(value,index,array){ xxxxx})· 数组中有几项，那么...
2020-04-10 18:01:51
6916
转载 回调函数callback
简介：回调函数实在另一个函数执行完毕后再执行的函数在JavaScript中，函数是对象。因此，函数可以将函数作为参数，并且可以由其它函数返回。执行此操作的函数称为高阶函数。任何作为参数传递的函数都成为回调函数。function funA() { console.log("A");}function funB() { console.log("B");}fu...
2020-04-10 17:00:08
226
原创 if判断中的true或false
真值指的是在布尔值上下文中转换后（使用强制类型转换）的值为真的值。所有值都是真值(除了false，0，""，null，NaN和undefined外)。真值示例如下：if (true)if ({})if ([])...
2020-04-03 22:29:28
2062
原创 vue elementui 三级分类
1.template中 <div class="table_content"> <div class="custom-tree-container"> <el-table v-loading="loading" :header-cell-style="getRowCla...
2020-04-03 16:50:07
2891
原创 vue elementui列表嵌套功能实现
<div class="table_content"> <el-table border :data="tableData" v-loading="loading" style="width: 100%" row-key="product_id" ...
2020-04-03 12:50:50
1384
原创 vue动态添加表单项
1. <div v-for="(item, index) in ruleForm.group" :key="'info-' + index" class="bgc"> <div class="fenFlex sellPr"> ...
2020-04-03 11:30:26
1828
2
原创 vue elementui 表单多项对应
1.@change="((val)=>{groupSel(val,index)})"2. groupSel(val, _index) { // console.log(val, _index, '0000') if (val) { this.ruleForm.group[_index].jianSel = true } el...
2020-04-03 10:36:03
361
原创 vue 列表搜索缓存（进入详情页返回列表，记住列表数据）
1. beforeRouteLeave(to, from, next) { if (to.name === 'productlist-detail') { this.saveSearchData(this.$route.name, this.searchData, this.page, {}) } else { this.clearSearchDat...
2020-04-02 16:20:44
2574
原创 vue elementui Select 选择器
1.template中 <el-col :xs="24" :sm="24" :md="24" :lg="6" :xl="4"> <div class="pub_input_content"> <span class="pub_input_title">审核状态</span> ...
2020-04-01 12:32:21
1205
原创 vue elementui 日期datetimerange
1.template中： <el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="8"> <div class="pub_input_content"> <span class="pub_input_title pub_input_title_data"&...
2020-04-01 12:11:20
6584
原创 vue elementui Checkbox 多选框
1.template中： <div class="pl30"> <el-checkbox-group v-model="cate_id" size="mini"> <el-checkbox-button v-for="(cate, index) in cates" :...
2020-04-01 11:30:59
518
原创 vue el-cascader 动态加载（三级分类或省市区）
1.tempalte中： <el-dialog width="600px" title="商品类目编辑" :visible.sync="dialogVisible"> <el-cascader v-model="partyOrganId" :props="{ ...
2020-03-31 11:35:44
3147
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人