- 博客(21)
- 收藏
- 关注
RSS订阅原创 vue3 使用 vant 适配rem
第一步在main.js引入import 'amfe-flexible'// 引入rem适配完成以上操作会很可能会报错解决方法: 将package.json的版本号修改低一点, 然后 npm i 下载一下依赖, 并且重启 就可以了.版本号改成跟截图一样即可...
2022-01-05 15:11:51
516
原创 vant Ui 网址
Vant - Mobile UI Components built on VueMobile UI Components built on Vuehttps://vant-contrib.gitee.io/vant/#/zh-CN/home
2021-12-04 15:54:51
479
原创 js中事件对象中七种坐标
1. clientX clientY 相对于浏览器的左上角的xy坐标 也就是窗口坐标, 不包括工具栏, 滚动条2. layerX layerY 是鼠标相对于目标元素最近的具有absolute relative的定位元素的位置 包括border3. movementX movementY 两个鼠标移动事件间隔时间中当中鼠标移动的相对坐标4. offsetx offsetY 相对于你点击的那个dom节点...
2021-11-16 23:23:01
649
原创 vue element table 切换 数据错乱问题
当多个table 使用v-if切换显示时. 并且表格的长短不一的情况下, 切换表格会出现排版和数据错乱解决办法:在对应的table 加上 key 属性就可以了.还有一种情况是, 表格只有一个 但需要动态的改变数据, 就可能需要用到doLayout 方法 具体使用看element 官网的table项...
2021-11-16 11:33:43
2435
原创 vue $set的使用
使用场景: 当vue想直接修改数组的元素时, 这个使用需要使用this.$set()来修改数组如果直接修改数组且不使用this.$set(), 则会出现页面延迟响应数据的结果使用方法:this.$set(array,index,value)array: 是你需要的数组index: 是你要修改的元素的下标value: 是你最新的值let array = [ {name:'张三',age:12}, {name:'李四',age:13}, {name:'王五'
2021-11-13 17:26:49
1115
原创 使用ts-node demo.ts命令报错
1.TSError: ⨯ Unable to compile TypeScript:code.ts:1:1 - error TS2584: Cannot find name 'console'. Do you need to change your target library? Try changing the 'lib' compiler option to include 'dom'.1 console.log("hello TS");最近在学习typescript 报了个错, 有点...
2021-11-04 21:36:25
2387
1
原创 控制vConsole在开发模式显示在生产模式隐藏
在main.js 中引入,import VConsole from 'vconsole';// 判断是否为生产环境 否则显示vConsole移动端调试工具if(process.env.NODE_ENV !== "production"){ new VConsole();}以上操作就可以成功了在网上看了好多好长, 我看不懂, 所以直接根据process.env.NODE_ENV 进行判断效果也可以实现如果想直接去掉的话 可以在App.vue里面引入样式
2021-10-27 16:15:35
1819
原创 vue 打包后找不到dist文件夹
接受一个别人做了一半的项目 , 结果要打包测试的时候 执行npm run build 后 没有dist 文件看了一下 build文件夹里面的index.js 文件 的build对象,原来是默认的打包路劲被修改了 , 修改回来就好了,__dirname是获取当前位置的绝对路径...
2021-10-27 11:16:55
5649
3
原创 vscode常用插件---Prettier - Code formatter
1. 配置 在vscode设置里面的 settings.json文件中 加入以下代码 "prettier.configPath": "C:\\Users\\Administrator\\.prettierrc", // \Administrator "eslint.alwaysShowStatus": true, "prettier.trailingComma": "none", "prettier.semi": false, //每行文字个数超出...
2021-10-24 01:48:50
1561
原创 vscode常用插件---ESlint
1. 插件作者: Dirk Baeumer2. 作用: 在vscode 就进行代码规范验证3. 配置: 在vscode 设置 里面的 settings.json 加上以下代码 //ESlint 插件的配置 "editor.codeActionsOnSave": { "source.fixAll": true },...
2021-10-24 01:34:38
411
原创 vue自定义指令
自定义指令分为: 自定义私有指令和自定义全局指令自定义私有指令简写形式 directives: { color(el, binding) { console.log(el); // el是绑定自定义属性的dom对象 console.log(binding); // binding 是指令后面带的值 例如: v-color="coloraa" 其中coloraa是一个定义在data函数里面的数据 或者 v-color="''red" e
2021-10-24 00:03:26
296
原创 vue组件间的传值
1. 父组件传子组件： 利用自定义属性2. 子组件传父组件： 利用this.$emit自定义事件3. 利用evenbus传值4. 利用vuex传值
2021-10-20 00:35:41
71
原创 vue的生命周期图解
1. 什么是生命周期: 简言之: 生命周期就是 从生( 创建) 到死( 销毁 )的一个过程2.生命周期全程图解3. 生命周期的三大阶段
2021-10-18 00:14:11
129
原创 vscode常用插件-Auto Close Tag
1. 插件作者: Jun Han2. 作用: 自动补全结束标签// 输入<MyTag>// 就可以自动补全<MyTag></MyTag>3. 配置: 不需要配置, 直接下载就可用
2021-10-17 20:52:42
8530
原创 vscode常用插件 - Path Autocomplete
1. Path Autocomplete作用: 在vscode中使用@提示路劲 配置 打开vscode设置 搜索 settings.json 添加以下代码 // 导入文件时是否携带文件的拓展名 "path-autocomplete.extensionOnImport": true, // 配置@的路径提示 "path-autocomplete.pathMappings": { "@": "${folder}/src" },效果图
2021-10-17 20:31:15
4300
原创 ✖ 2 problems (0 errors, 2 warnings) 0 errors and 2 warnings potentially fixable with the `--fix`
1. 说有两个警告 , 需要删除一个点 和加一个回车, 但我找不到位置, 所以直接使用 ,2. 报警告的原因, 我创建项目的时候选择了eslint 代码规范,3. 解决办法, 执行npm run lint --fix自动修复警告npm run lint --fix4. 结果, 没有警告了...
2021-10-17 19:19:23
8331
2
原创 在vue-cli2使用Network同步开发
1. 打开cmd 输入 ipconfig 找到IPv4 2. 在build/webpack.dev.config.js 的host注释掉 修改成IPv4即可3. 重启一下 项目就可以使用同个局域网下实时同步项目的修改效果了.
2021-09-30 11:57:02
357
原创 vue-cli2自动适配rem
1. 安装lib-flexble和px2rem-loadernpm i lib-flexible -Snpm i px2rem-loader -S2. 在main.js引入lib-flexbleimport 'lib-flexible/flexible';3. 在build/util.js文件中添加以下代码const px2remLoader = { loader: 'px2rem-loader', options: { remUnit: 37.5//..
2021-09-29 01:29:21
296
1
原创 javascript 对数组的对象进行分类
转换前的数据 let arr = [ {name: "第一种",id: "1"}, {name: "第一种",id: "2"}, {name: "第二种",id: "4"}, {name: "第一种",id: "3"}, {name: "第一种",id: "10"}, {name: "第二种",id: "5"}, {n.
2021-09-13 00:33:21
1371
2
原创 手写无缝轮播图
html <div class="wrapper"> <div class="banner_box"> <div class="banner1"> <img src="./img/1.jpg" alt=""></div> <div class="banner2"> <img src="./img/2.jpg" alt=""></div>.
2021-09-12 12:41:29
164
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人