- 博客(54)
- 收藏
- 关注
原创 lottie 动画播放
参考https://developers.weixin.qq.com/community/develop/article/doc/000e2c86aa0ab058465d67e9452013。① path (json 线上地址) 执行path: ‘https://assets9.lottiefiles.com/packages/lf20_CZva9peGiW.json’,lottie官网: http://airbnb.io/lottie/#/README。注意如果想要综合使用得结合。
2023-03-21 15:15:31 2883
原创 前端面试题
面试题一.HTML1.常用哪些浏览器进行测试,对应有哪些内核?①IE------------------->Trident②Chrome---------->以前是Webkit现在是Blink③Firefox------------>Gecko④Safari-------------->Webkit⑤Opera-------------->最初是Presto,后来是Webkit,现在是Blink(Webkit的分支)2.行内元素和块级元素的区别?行内块元素的兼容
2022-05-06 10:11:49 395
原创 正则表达式
正则表达式一.限定符? 前面的那个字母出现零次或者1次 ab?c ------------------>(ac)-(abc)*号 零个或者多个
2022-04-14 23:19:13 699
转载 vue3快速上手01
Vue3快速上手1.Vue3简介2020年9月18日,Vue.js发布3.0版本,代号:One Piece(海贼王)耗时2年多、2600+次提交、30+个RFC、600+次PR、99位贡献者github上的tags地址:https://github.com/vuejs/vue-next/releases/tag/v3.0.02.Vue3带来了什么1.性能的提升打包大小减少41%初次渲染快55%, 更新渲染快133%内存减少54%…2.源码的升级使用Proxy
2022-01-12 11:12:44 121
原创 工作常见问题
C端1.关于底部遮挡问题底部按钮遮挡内容(苹果X)在上边的区域加上 padding-bottom: calc(110rpx + env(safe-area-inset-bottom));2.下拉刷新参考页面pages/coupon/center/indexpages/setGame/gameListonPullDownRefresh:function(){ this.couponActivityList = [];//下拉列表为空 this.pageIndex =
2021-12-09 14:47:48 967
原创 ts语法。
1、强类型与弱类型强类型:不允许改变变量的数据类型,除非进行强制类型转换弱类型:变量可以被赋予不同的数据类型2、动态类型与静态类型静态类型:在编译阶段确定所有变量的类型动态类型:在执行阶段确定所有变量的类型3、项目准备1、初始化工程:npm init -y2、安装typescript:npm i typescript -g3、初始化tsc编译器配置文件:tsc --init4、初始化构建工具:npm i webpack webpack-cli webpack-dev-server -D
2021-12-06 20:26:58 1063
原创 微信小程序总结
事件绑定scroll-view必须要写高度与滚动方向样式设置三个view改为一行1.利用浮动-----float:left2.或者给父标签一个display:flex; 有间隙的话利用justify-conent:space-aroundblock与viewblock相当于vue中的template不占用位置(减少了不必要的渲染元素)wx:if与hidden1.运行方式不同wx:if 以动态创建和移除元素的方式,控制元素的展示与隐藏hidden 以切换样式的方式( dis
2021-07-03 19:53:49 741 2
原创 表单登录~跳转
实现登录实现登录前表单数据的预验证1.给表单登录事件 <el-button type="primary" size="medium" @click="login">登录</el-button> 2.点击事件方法 login() { // 登录的预先验证 this.$refs.ruleForm.validate(isOK => { console.log(isOK) }) }配置axios发起登录请求1
2021-06-29 20:09:50 823 2
原创 核心面试题
怎么给jQuery扩展插件1.通过$.extend()来扩展jquery语法:$.exend({})缺点:这种方式无法利用jquery强大的选择器带来的便利2. 通过$.fn向jQuery添加新的方法语法$.fn.pluginName=function(){ your code goes here }<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" />
2021-06-28 23:21:44 141 2
原创 vuex基础
vuex的由来在组件中如果是父子或者兄弟都可以进行一定的方法让他们联系起来,那么非关系型组件怎么联系起来呢?vuex的作用非关系型组件数据的共享vuex基础-介绍vuex是采用集中式管理组件依赖的共享数据的一个工具,可以解决不同组件数据共享问题。结论修改state状态必须通过mutationsmutations只能执行同步代码,类似ajax,定时器之类的代码不能在mutations中执行执行异步代码,要通过actions,然后将数据提交给mutations才可以完成state的状
2021-06-16 20:16:14 221
原创 vue面试题
组件传值兄弟传值1.创建一个vue实例2.写组件3.创建一个事件中心 var hub = new Vue();4.传递数据方,触发兄弟组件的事件,通过一个事件触发hub.emit(方法名,传递的数据)5.接收方通过mounted()钩子中触发hub.emit(方法名,传递的数据)5.接收方通过mounted(){}钩子中 触发hub.emit(方法名,传递的数据)5.接收方通过mounted()钩子中触发hub.on()方法<!DOCTYPE html><html lan
2021-06-15 13:19:07 408 4
原创 vue出现的问题
模拟失败请求<script> // 随机错误 if (Math.random() > 0.5) { return JSON.parse('error') } </script>常见误区常见错误
2021-06-04 22:08:14 107 2
原创 记住列表滚动位置
<script> //把下边的代码粘贴到浏览器Console中敲回车,然后滚动界面,它会输出滚动的元素function findScroller(element) { element.onscroll = function() { console.log(element)} Array.from(element.children).forEach(findScroller);}findScroller(document.body);</script>
2021-05-27 21:09:57 141
原创 黑马后台管理--路由分配
黑马后台管理–路由分配案例分析基本组成app根组件通过路由的方式加载到页面代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" /> <title>基于vue-router的案例</title> <style type="text/css"> html, body, #app { ma
2021-05-08 22:23:01 316
原创 vue-router编程式导航
vue-router编程式导航1. 理解2.例子 利用push方法完成跳转在user1里面放一个按钮 点击就会跳转到Register页面代码如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="v
2021-05-08 20:31:13 144
原创 vue-router命名路由
vue-router命名路由例子如下<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2021-05-08 20:12:02 115
原创 vue-router动态路由匹配
1.动态路由匹配1.2例子代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
2021-05-08 19:47:28 368
原创 vue-router嵌套路由
vue-router嵌套路由1.例子如下2.注意最重要的就是在父组件里面添加子组件,如下:<router-link to="/register/tab1">tab1</router-link><router-link to="/register/tab2">tab2</router-link> <!-- 子路由的占位符 --><router-view />3.代码如下<!DOCTYPE html>&l
2021-05-08 19:21:18 161
原创 vue-router的基本使用
vue-router的基本使用介绍它是一个Vue.js官方提供的路由管理器。是一个功能更加强大的前端路由器,推荐使用官网:https://router.vuejs.org/zh/基本使用步骤1导入js文件2.添加路由链接3.添加路由占位符(最后路由展示的组件就会在占位符的位置显示)4.定义路由组件5.配置路由规则并创建路由实例6.将路由挂载到Vue实例中1.导入js文件1.1如果不想下载可以用网链接的形式<script src="https://unpkg.com/vue
2021-05-07 19:54:02 197
原创 图书管理系统
步骤axios官方文档1.展示数据1.1 获取数据①页面一开始加载就应该获取数据–>生命周期一开始就会加载created(){}mounted(){}所以就在这两个方法里发送数据请求,两个都可以②axios本身是promise1.1.1 注意:回调函数与箭头函数1.2.展示数据①利用v-for…②数据格式是在文档里1.2.1 注意:关键一步:赋值得对1.3优化代码1.3.1基准路径axios.defaults.baseURL = ‘http://39.103.
2021-05-06 23:58:58 153
原创 前端小技巧
1.怎样获取页面html元素①打开页面点击鼠标右键(检查)②看到想要获取的div点击右键copy–>copy outerHTML③引入样式是利用的link标签引入例如 <link rel="stylesheet" href="mybook/public/css/index.css">...
2021-05-06 22:54:13 69
原创 终端抛出异常 --> nodemon
终端抛出异常1.解决问题的最重要的是看他抛出的异常2.路径不要写错,转换路径用的是cd3.自动补全路径用的是Tab4. 端口占用记得把其他终端关了或者改端口号
2021-05-06 19:32:11 80
原创 购物车案例
购物车案例效果图如下:1. 按照组件化方式实现业务需求1.1根据业务功能进行组件化划分①标题组件(展示文本)②列表组件(列表展示·商品数量变更·商品删除)③结算的组件(计算商品总额)2. 功能实现步骤2.1实现整体布局和样式效果2.2划分独立的功能组件2.3组合所有的子组件形成整体结构2.4逐个实现各个组件功能2.4.1标题组件2.4.2列表组件2.4.1结算组件3.代码如下<!DOCTYPE html><html lang="en"><
2021-05-05 20:48:36 133
原创 组件插槽
组件插槽1. 插槽基本使用1.1理解:插槽,就是用于占位,等待的父组件的内部内容插入进来1.2步骤详细描述①定义组件的时候,在template模板中留一个位置,插槽:②使用组件的时候,在组件中间,填写内容(这个内容,会传递到slot中)1.3案例如下<body> <div id="app"> <menu-item>有bug发生</menu-item> <menu-item>有一个警告<
2021-05-05 16:30:55 501
原创 组件间的相互传递
父组件向子组件传值1.基本用法2.父组件向子组件传递2.1动态传递<body> <div id="app"> <div>{{pmsg}}</div> <menu-item :title='title1'></menu-item> </div> <script src="js/vue.js"></script> <scrip
2021-05-05 00:02:38 235
原创 过滤器(格式化日期)
过滤器(格式化日期)代码如下<script>/** * 对日期进行格式化, * @param date 要格式化的日期 * @param format 进行格式化的模式字符串 * 支持的模式字母有: * y:年, * M:年中的月份(1-12), * d:月份中的天(1-31), * h:小时(0-23), * m:分(0-59), * s:秒(0-59), * S:毫秒(0-999)
2021-05-03 19:29:04 234
原创 自定义指令
自定义指令的语法规则获取元素焦点<script> Vue.directive('focus',{ inserted:function(el){ el.focus() } })</script>
2021-05-03 19:21:09 71
原创 解读joi.not(joi.ref(‘oldPwd‘)).concat(password) 规则
解读joi.not(joi.ref(‘oldPwd’)).concat(password) 规则<script> // 1. joi.ref('oldPwd') 表示 newPwd 的值必须和 oldPwd 的值保持一致 // 2. joi.not(joi.ref('oldPwd')) 表示 newPwd 的值不能等于 oldPwd 的值 // 3. .concat() 用于合并 joi.not(joi.ref('oldPwd')) 和 password 这两条验证规则
2021-04-27 20:21:16 985 1
原创 创建基本服务器与路由模块
一.创建基本服务器<script>// 创建基本结构 基本服务器// 导入expressconst express = require('express')// 创建服务器的实例对象const app = express()// 启动服务器//端口号(3007)可以变app.listen(3007, () => { console.log('api server running at http://127.0.0.1:3007');})</scrip
2021-04-27 16:26:57 74
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人