- 博客(132)
- 收藏
- 关注
原创 vs code 波浪线报错
11. 在每个项目中编辑文件时,VSCode会自动保存项目的工作状态,包括打开的文件、编辑器布局等。12. 如果你想移除某个项目,可以点击侧边栏中的”工作空间”图标,然后点击右侧的删除按钮。9. 当你在工作区中打开多个项目时,可以在VSCode的侧边栏中看到它们的文件夹列表。3. 在弹出的文件浏览器中,选择要打开的第一个项目文件夹,点击“选择文件夹”按钮。6. 在弹出的文件浏览器中,选择要添加的项目文件夹,点击“选择文件夹”按钮。10. 点击列表中的项目文件夹,你可以切换不同的项目。
2024-07-05 14:22:28
654
原创 swiper loop 为 true 的时候 click 事件失效问题
项目中使用 swiper 时,设置 loop:true时,slides前后会clone若干个slide,从而形成一个环路,但是却不会复制绑定在dom上的click事件,导致复制的slides点击不会跳转。不要将click事件绑定在dom上,而是在放在 on() 回调函数中调用。
2024-04-24 16:42:38
702
原创 Package search npm & yarn
npm package : npm | Homeyarn package : Yarnnpm install packageNameyard add packageName
2024-01-23 09:48:37
466
1
原创 nvm 安装 node 安装不上 npm
点击新版本的 nvm exe 文件安装,它会自动接管你的 node。然后 nvm install 之前卸载的 node list 即可。nvm -v 查看到自己的 nvm 版本号是 1.1.7。nvm uninstall 各个版本只保留一个最低版本。nvm list 查看手里 node 的所有版本。下载最新版本的 nvm .exe 文件。npm -v 发现没有安装上。node -v 安装上了。
2023-10-18 10:48:33
952
原创 Vue load 页面报错:Error: Request failed with status code 404 ###createError.js
cmd 运行 netstat -aon 查看 0.0.0.0:8080 端口被哪个 PID 号占用 如 “4444”然后打开人物管理器,看看是哪个程序的 PID 号是 4444,然后修改改程序占用的端口号就可以啦。网上各种查找原因,说是后台接口对接跨域问题,但是相同的项目其他同事都能正常链接。折腾好久,把同事的整个 node_modules 文件夹复制过来,还是不行。也有说是 .env 文件问题,但是我这个项目没有该文件。后来发现又其他软件占用的 8080 接口。
2023-09-24 14:18:52
374
原创 MPX 小程序框架 - Tracy 小笔记
基于 Mobo 实现高效的数据相应,基于 webpack 实现基于依赖手机的优化编译。MPX:全面拥抱原生的框架。
2023-09-17 10:54:35
812
原创 Selenium - Tracy 小笔记2
它可以让python代码调用浏览器。并获取到浏览器中加们可以利用selenium提供的各项功能。帮助我们完成数据的抓取。1.掌握 selenium发送请求,加载网页的方法。2.掌握selenium简单的元素定位的方法。selenium本身是一个自动化测试工具。它没有逻辑,只有相应的函数,直接搜索即可。3.掌握selenium的基础属性和方法。4.掌握selenium退出的方法。
2023-09-10 10:43:47
1675
原创 项目打包和自动化部署
如下是安装 jenkins 的命令,它的意思是安装 “http://pkg.jenkins-ci.org/redhat-stable/jenkins.repo” 到我们服务器的文件夹 “/etc/yum.repos.d/”中并且命名为“jenkins.repo” (注意,这里必须要下载到这个文件夹下这个程序才能生效)等到测试阶段,开发人员等待测试反馈bug,也会处于等待状态。Tips:因为我们之前选的服务器的操作 系统的版本是 8点多的版本,因此它自带dnf,是操作系统里的包管理工具,很像npm。
2023-07-20 18:44:02
381
原创 类型的查找(类型声明) - Tracy TypeScript 小笔记
外部类型声明通常是我们使用一些库(比如第三方库)时,需要的一些类型声明这些库通常有两种类型声明方式:方式一:在自己库中进行类型声明(编写.d.ts文件),比如axios方式二:通过社区的一个公有库DefinitelyTyped存放类型声明文件该库的GitHub地址:https://github.com/DefinitelyTyped/DefinitelyTyped/该库查找声明安装方式的地址:https://www.typescriptlang.org/dt/search?search=
2022-12-25 20:49:10
352
原创 模块化开发(命名空间和模块化) - Tracy TypeScript 小笔记
通过namespace来声明一个命名空间 (命名空间其实不太常用,了解即可。就是当同一个文件中的两个函数都想取相同名称的时候,就可以把这两个函数变量等 放置到不同的命名空间里去)每个文件可以是一个独立的模块,支持ES Module,也支持CommonJS。
2022-12-25 19:39:30
171
原创 Tracy vue3 小笔记 - template 数据访问顺序
相同变量名的时候, 展示顺序如下 setup > data > computed。原因可查看 Vue 中的源代码,它是一个 if else 语句的一个判断。
2022-09-30 12:33:59
399
原创 Composition API (setup)&& Options API
Options API的一大特点就是在对应的属性中编写对应的功能模块;p比如data定义数据、methods中定义方法、computed中定义计算属性、watch中监听属性改变,也包括生命 周期钩子当我们实现某一个功能时,这个功能对应的代码逻辑会被拆分到各个属性中;当我们组件变得更大、更复杂时,逻辑关注点的列表就会增长,那么同一个功能的逻辑就会被拆分的很分散;尤其对于那些一开始没有编写这些组件的人来说,这个组件的代码是难以阅读和理解的(阅读组件的其他人);...
2022-08-06 15:52:06
298
原创 setup 中响应式数据的两种实现方法 & reactive API, ref,ReadOnly
我们通过reactive或者ref可以获取到一个响应式的对象,但是某些情况下,我们传入给其他地方(组件)的这个 响应式对象希望在另外一个地方(组件)被使用,但是不能被修改,这个时候如何防止这种情况的出现呢?readonly会返回原生对象的只读代理(也就是它依然是一个Proxy,这是一个proxy的set方法被劫持,并且不 能对其进行修改);注意 传递给子组件父组件等的数据,也需要是响应式的才能联动。但是经过readonly处理的原来的对象是允许被修改的;readonly返回的对象都是不允许修改的;.....
2022-08-06 15:51:05
454
原创 Reactive判断的API,toRef & toRefs,ref其他的API,customRef
isProxy检查对象是否是由reactive或readonly创建的proxy。isReactive检查对象是否是由reactive创建的响应式代理如果该代理是readonly建的,但包裹了由reactive创建的另一个代理,它也会返回true;isReadonly检查对象是否是由readonly创建的只读代理。toRaw返回reactive或readonly代理的原始对象(不建议保留对原始对象的持久引用。请谨慎使用)。...
2022-07-31 16:34:23
188
原创 对象的深拷贝和浅拷贝
1.浅拷贝es6 新增方法 Object.assign const info = {name: "why", age: 18, friend: {name: "kobe"}}; const obj = Object.assign({}, info); info.name = "kobe"; console.log(obj.name); info.friend.name = "james"; console.log(obj.friend.name);2.深拷贝
2022-04-24 19:22:38
982
原创 Tracy vue3 小笔记 1 - 如何使用 VUE, MVC, MVVM, Template, Vue 源码
那么安装和使用Vue这个JavaScript库有哪些方式呢?方式一:在页面中通过CDN的方式来引入;方式二:下载Vue的JavaScript文件,并且自己手动引入;方式三:通过npm包管理工具安装使用它(webpack再讲);方式四:直接通过Vue CLI创建项目,并且使用它Demo code <div id="app"> <h2>Hello World</h2> </div> <script src="https
2021-12-13 15:42:40
679
1
原创 css px 转成 vw 插件 像素单位批量转换
1.安装npm install postcss-px-to-viewport --save-dev2.配置postcss.configs.js// https://github.com/michael-ciniawsky/postcss-load-configmodule.exports = { "plugins": { "postcss-import": {}, "postcss-url": {}, // to edit target browsers:
2021-12-03 17:15:41
1385
原创 图片懒加载插件
用于在页面滑动到图片所在位置的时候再加载,从而不影响页面加载速度的插件。1.安装npm install vue-lazyload --save--dev2.引入main.js 中添加import VueLazyload from ''vue-lazyload'Vue.use(VueLazyload) //普通引入Vue.use(VueLazyload,{ loading: require('./assets/image/common/placeholder.pn...
2021-12-03 16:39:35
1506
原创 FastClick 解决移动端 300毫秒点击延迟的插件
FastClick 是 FT Labs 专门为解决移动端浏览器 300毫秒点击延迟问题所开发的插件公司没有特定要求的话可以不用的,了解即可安装方式 npm install fastclick -- save在 main.js 中引入import FastClick from 'fastclick'FastClick.attach(document.body);...
2021-12-03 16:30:53
196
原创 Toast 插件封装方式 自己创建一个插件
调用方式:this.$toast.show("成功");components/toast/Toast.vue<template> <div class="toast" v-if="isShow">{{message}} </div></template><script type="text/javascript">export default { name: "Toast", data() { return { .
2021-12-03 16:19:09
575
原创 Vue 响应式原理 defineProperty 监听对象属性的改变 观察者模式
不要认为数据发生改变,界面跟着更新是理所当然的。 Vue 背后做了很多的操作才实现了这个效果1.Vue 内部是如何监听的呢一个变量 message 数据的发生了改变呢?答: Object.defineProperty -> 监听对象属性的改变2.监听到了数据改变,Vue 又如何知道要通知哪些人来让界面发生刷新呢?既: 页面有三个 {{message}} {{message}} {{message}}, 它怎么知道要通知这三个地方呢?答: 利用“发布订阅者模式” Object
2021-12-03 10:07:58
442
原创 点击标题滚动到对应的 section, 滚动到对应的section 对应的标题高亮
<template> <div class="home"> <tab-control class="tab-control" ref="tabControl" :titles='["商品", "参数", "评论", "推荐"]' @tabClick="tabClick" /> <scroll class="scroll" ref="scroll" :probeType="3" :pullUpLoad="true" @scroll="handleScrol.
2021-11-01 14:23:49
394
原创 添加商品到购物车 Vuex
商品详情/购物车页面 code<template> <div class="home">购物车车 <button @click="addGood(1)">Add Good1</button> <button @click="addGood(2)">Add Good1</button> <button @click="addGood(3)">Add Good1</button> <ul
2021-11-01 14:17:27
791
原创 Vue 获取元素的 offsetTop 可能会遇到的坑
在哪里才能获取到正确的 offfsetTop? 1.created 肯定不行,压根通过 this.$refs 获取不到元素 2.mounted 也不行,数据还没有获取到 3.updated 也不行,获取到了数据 Dom 还没有渲染 4.$nextTick 也不行,因为 dom 渲染了但是图片还没有加载完毕 5.在图片都加载完毕后获取元素的 offsetTop, 这里注意防抖函数的应用普通 元素用的是 this.$refs.元...
2021-10-26 11:37:19
9868
1
原创 Tracy Vue 小笔记之 mixin 混入
如果多个组件中,都会调用相同的代码如相同的组件,相同的 methods, 相同的变量,相同的过滤器等,那么可以利用混入 mixins混入的 js 文件命名为:mixin.js//混入 minxin 导出的是一个对象,不是方法,这个对象中可以放 methods, data 等export const dateFormateFilterYYYYMMDD = { filters: { dateFormate(time) { return timeFormate(time, "
2021-10-14 14:57:54
165
原创 时间戳的格式化 filters:
数据库一般存的日期数据都是一个时间戳,很少存字符串html code: {{ good.time| showDate}}filters:{ showDate(value) { //1.先将时间戳转化为日期格式 const date = new Date (value*1000) ; //因为 new Date 中要传一个到毫秒的时间戳,而我们的时间戳是到秒,所以 * 1000 //2.将 date 进行格式化...
2021-10-11 11:20:42
221
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人