![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Web网页前端
文章平均质量分 54
前端的一些东西学习
x_lcw
这个作者很懒,什么都没留下…
展开
-
前端websocket配置
前端websocket配置原创 2023-06-16 22:54:37 · 467 阅读 · 3 评论 -
前端显示图片的两种方式
前端显示图片使用封装API的方式原创 2022-11-22 01:41:32 · 947 阅读 · 0 评论 -
前端文件流相关
前端文件流相关原创 2022-11-21 17:48:57 · 1278 阅读 · 0 评论 -
Blob和ArrayBuffer和File
Blob对象ArrayBuffer对象原创 2022-11-21 01:38:37 · 482 阅读 · 0 评论 -
JS位运算符
js位运算原创 2022-11-20 03:12:43 · 234 阅读 · 0 评论 -
Vue3学习
Vue3(一)原创 2022-11-05 15:17:50 · 480 阅读 · 0 评论 -
踩坑antv/g2,export ‘getEllipsisText‘ was not found in ‘@antv/util‘
踩坑原创 2022-11-01 00:39:20 · 837 阅读 · 0 评论 -
最近前端杂项
最近前端杂项原创 2022-11-01 00:33:44 · 545 阅读 · 0 评论 -
AntDesignVuePro部署踩坑
AntDesignVuePro部署踩坑原创 2022-10-22 05:34:32 · 1403 阅读 · 5 评论 -
计算属性,过滤器,侦听器
vue计算属性,过滤器,侦听器原创 2022-10-16 19:04:59 · 334 阅读 · 0 评论 -
lodash几个常用的函数
lodash原创 2022-10-15 22:53:04 · 186 阅读 · 0 评论 -
记录axios响应慢的问题以及vue跨域和nginx跨域区别
vue跨域和nginx跨域原创 2022-09-29 00:31:17 · 2107 阅读 · 0 评论 -
正则表达式记录
正则表达式原创 2022-09-26 18:17:01 · 106 阅读 · 0 评论 -
前端杂项记录
前端杂项记录原创 2022-09-25 00:53:26 · 335 阅读 · 0 评论 -
antdvPro路由生成逻辑
antdvPro默认路由逻辑原创 2022-08-30 02:54:59 · 340 阅读 · 0 评论 -
Vue插槽总结
Vue插槽总结原创 2022-08-28 04:19:59 · 135 阅读 · 0 评论 -
使用yarn
命令大多和npm相同。原创 2022-07-21 12:01:13 · 101 阅读 · 0 评论 -
JS数组的一些常用方法
啥是回调函数A callback is a function that is passed as an argument to another function and is executed after its parent function has completed。一个被作为参数传递给另一个函数的函数。filterfindIndexmapsplice原创 2022-05-17 16:47:43 · 388 阅读 · 0 评论 -
DOM簇拥
DOM获取节点 <h1 id="title">hello world</h1> <button class="btn">1</button> <button class="btn">2</button> <button class="btn">3</button> <script> let h1 = document.querySelector原创 2022-03-13 15:09:13 · 375 阅读 · 0 评论 -
Node基础
安装模块:本地安装,全局安装 -g(可以在黑窗口里 使用模块带有的命令)-- save # 下载时将 第三方模块的依赖关系记录到 package.json 文件的 dependencies 字段中。npm install # 会在当前目录中寻找 package.json 文件, 并将 dependencies 字段 里包含的所有模块 都进行下载创建一个 node项目 :npm init,实质上是 添加了一个 package.json 文件Node 模块化开发在实际项目开发中,不可能将原创 2022-03-13 21:21:42 · 2515 阅读 · 0 评论 -
Node环境创建Vue项目
使用Node环境创建Vue项目npm install -g @vue/clivue create hello 在当前目录下创建 Vue 项目(这里注意 找到 .vuerc配置文件,找到淘宝镜像,修改为 true,否则会很慢)Vue 模板语法Vue 文件 没有高亮,都是白的在 Vscode 中 settings.json 中编辑: "files.associations": { "*.vue": "html" // 设置 Vue文件高亮原创 2022-05-02 16:31:55 · 936 阅读 · 0 评论 -
数据类型,数组,对象,函数
alert(info); // 浏览器 弹出警示框prompt(info); // 浏览器 弹出输入框, 返回值是 string 类型。console.log(msg); // 浏览器控制台打印信息isNaN(msg); 判断是否为非数字的类型, 返回 bool 型。字符串转义字符\n 换行\\ 斜杠 \\' 单引号\" 双引号\t tab 缩进\b 空格var str='nihao';console.log(str.lengt原创 2022-03-02 11:53:28 · 134 阅读 · 0 评论 -
Vuex状态管理基本使用
npm i vuexVuex 和单纯的全局对象有以下两点不同:Vuex的状态存储是响应式的。不能直接改变 store 中的状态,更改Vuex的 store 中的状态的唯一方法是提交 mutation。原创 2022-05-16 22:33:48 · 160 阅读 · 0 评论 -
Promise异步async&await
在代码的执行过程中,碰见异步代码,先单独放置另一队列,原有队列继续执行(不被阻塞)PromisePromise 对象有三个状态:pending、fulfilled 和 rejected。resolve使Promise状态变为fulfilled,reject使Promise状态变为 rejectedthen方法和catch方法都是异步代码当Promise对象中是resolve时,外面可以没有then去处理。当Promise对象中是reject时,外面要么then要写第二个函数参数去处理,要么使用.原创 2022-05-20 22:34:13 · 605 阅读 · 0 评论 -
Vue使用
<div id="app"> <h1>{{ message + "你好" }}</h1> <!-- {{ }} 绑定文本 --> <img :src="url" alt="" width="200px"> <!-- :绑定属性 --> <button @click="sayHi">测试按钮</button> ...原创 2022-03-15 11:23:12 · 1101 阅读 · 0 评论 -
Vue组件传值
父级组件向子级组件传值:子级组件向父级组件传值:<!-- App.vue --><template> <div> <h1>hello vnsief</h1> <h2>{{ChildCodata}}</h2> <ChildCo :msg="message" @myevent="changeData"></ChildCo> </div></t原创 2022-05-03 11:51:41 · 847 阅读 · 0 评论 -
Axios封装
拦截器Axios和(async,await)原创 2022-06-03 19:10:29 · 189 阅读 · 0 评论 -
内置对象,ES6
内置对象,ES6原创 2022-03-04 11:42:53 · 66 阅读 · 0 评论 -
关于Vue2项目打包
对于前端来说,自己看的时候,只需要mode改为hash模式中 如果项目上线要history模式,后端那里要去做重定向。打包后,用Live Server插件打开index.html页面,页面空白不显示, 也不行由于路由中,base属性(应用的基路径)默认为 但此时index文件在,相对于服务器扫描的路径 下解决办法:(最终目的都是将 index文件路径 和 base属性一致)第一种:将dist文件夹中的文件(index,css,js啥的),拿出来,就可以了第二种:修改base属性为:,重新打包原创 2022-06-06 01:53:52 · 1325 阅读 · 0 评论 -
关于 svg 图形和使用Three动画粒子波浪
这个指的是画布宽度,不是某一个图形的宽度fill 是填充也可以设置 ,即没有填充stroke是描边 / 边框,之后将这个组件引用到想应用的页面上吧。原创 2022-06-02 20:05:48 · 365 阅读 · 0 评论 -
Router路由守卫
切换路由之后,之前展示的组件不被销毁< keep-alive >是Vue的一个内部组件,适合用来缓存不需要实时更新的组件,这样可以保留组件状态,避免重新渲染。keep-alive是一个缓存的机制,keep-alive要配合router-view使用缓存多个:参数:include :接受字符串或正则表达式,需要被缓存的组件名exclude :接受字符串或正则表达式,不需要缓存的组件名max :接受数字,最多可以缓存多少组件实例路由组件所独有的两个钩子,用于捕获路由组件的激活状态。:聚集/激活时原创 2022-06-02 01:03:19 · 896 阅读 · 0 评论 -
router路由跳转过渡效果
过渡模式mode:1.新元素先进入过渡,完成之后当前元素过渡离开。2.当前元素先进行过渡离开,离开完成后新元素过渡进入。vue-router4过度动画无效:进入过渡的,还没进入,准备进入:进入过渡:进入过渡的:离开过渡的,还没离开,准备离开:离开过渡:离开过渡的 是表示针对 safari 浏览器支持,表示针对 IE 浏览器支持。translate:位移transform:形变(包括缩放,旋转,位移等等)transition:过渡opacity: 1;完全不透明opacity:0;完全原创 2022-06-01 19:39:52 · 502 阅读 · 0 评论 -
网页顶部进度条效果nprogress
可用于路由跳转和异步请求中路由逻辑中:router/index.js//////////////////////////////////////////////////////////import NProgress from 'nprogress' import 'nprogress/nprogress.css'// 一些配置NProgress.configure({ showSpinner:false, // 进度环隐藏 easing:'ease', speed:500,原创 2022-05-28 18:40:32 · 249 阅读 · 0 评论 -
遇到的一些问题
height:100%,使用margin出现纵向滚动条设置为height100%之后,login-box中再进行设置margin-top会出现纵向滚动条。十七:是因为你给子元素设置了margin后,body从上往下渲染时,起始位置不是从子元素的margin之上,而是直接从子元素上顶边开始从上往下渲染,所以你检查元素的时候发现body展示区域不是从页面的最顶部,所以之所以出现滚动条,多出来的部分就是子元素的margin部分,处理方法可一个body设置overflow:hidden或者给父元素设置pad原创 2022-05-26 02:06:45 · 919 阅读 · 0 评论 -
background:url不显示图片和几个CSS动画
vue中background:url(img)不显示图片也可以使用内嵌式,图片使用require导入,div也要有高度的,否则也是不显示。<div id="login-container" :style="{background: 'url(' + bgImg + ')'}">事件绑定的函数中传入dom参数<input type="text" name="" @focus="focusAction($event.target)" @blur="blurAction($event原创 2022-05-16 18:35:43 · 2404 阅读 · 0 评论 -
学到的一些CSS以及v-for使用注意
input输入框// 控制显示的内容// 并且设置 只读<input type="text" :value="item.num" readonly=true>input{ outline:none; border:none; // 设置输入框大小 width:40px; height:20px; // 输入框里的文本居中 text-align:center;}避免 v-for 与 v-if / v-show 一起使用想要实现相关功能,可以在 compute原创 2022-05-16 17:51:48 · 669 阅读 · 0 评论 -
记录写html时遇到的问题
关于块级元素,如 div独占一行块级元素中可以设置 width、height、padding、margin 等属性。默认情况下:宽度默认是它的 容器/父级 的100%,高度默认是由他的内容撑起。关于行内元素,如 span宽高设置不生效,宽度为内容宽度,高度也是内容高度body 和 htmlhtml由两个子元素:head,bodybody 和 html 都是块级元素,可以自由设置宽高默认情况下:body 和 html 的宽度都是浏览器宽度,高度由内容撑起height:100% 和 heig原创 2022-04-23 23:47:56 · 391 阅读 · 0 评论 -
CSSFlex布局
弹性盒子:可以控制下级盒子的位置弹性盒子中有主轴和交叉轴flex-direction:控制盒子的主轴方向,row就是横向,column就是纵向(default,横向)justify-content:控制下级盒子在主轴上上的对齐方式(默认从左侧开始,或从上侧开始)align-items:控制下级盒子在交叉轴上的位置(默认是stretch,即占满拉伸整个交叉轴)flex:1:占满剩余全部位置<body> <!-- 侧边栏 --> <div class原创 2022-05-01 17:28:17 · 716 阅读 · 0 评论