sk-xm - 博客园

2021年9月10日

摘要：演进史首先我们来说一下前端 icon 的发展史。远古时代在我刚开始实习时，大部分图标都是用 img 来实现的。渐渐发现一个页面的请求资源中图片 img 占了大部分，所以为了优化有了image sprite 就是所谓的雪碧图，就是将多个图片合成一个图片，然后利用 css 的 background 阅读全文

posted @ 2021-09-10 16:04 sk-xm 阅读(331) 评论(0) 推荐(0) 编辑

vue 中的h函数

摘要： 1 vue 虚拟dom 虚拟dom简单来说就是一个普通的JavaScript对象，包含tag，props，children三个属性。。。 <div id="app"> <p className="text">lxc</p> </div> // 上边的HTML代码转为虚拟DOM如下： { tag:"d 阅读全文

posted @ 2021-09-10 10:30 sk-xm 阅读(1685) 评论(0) 推荐(0) 编辑

2021年9月9日

自定义v-loading指令

摘要： 1. Loading组件 <template> <div> <van-loading :color="loadingList.color" vertical>{{ loadingList.title }}</van-loading> <div class="mask" v-bind:class="{ 阅读全文

posted @ 2021-09-09 18:03 sk-xm 阅读(1099) 评论(0) 推荐(0) 编辑

vue实例（instance）

摘要： 1. vue instance声明方式 const vm = new Vue({ el:"#app", //挂载的节点，一般都是通过id template:`<div>{{text}}</div>`, //模板 data:{ //数据 text:0 } }) 2. vue instance 上的属性阅读全文

posted @ 2021-09-09 17:55 sk-xm 阅读(704) 评论(0) 推荐(0) 编辑

2021年9月2日

vue 3.0 封装一个message提示组件

摘要：前言 vue2.x中，可以使用 Vue.extends 来封装一个弹框，在vue 3.0中，该api已经被废除。实现后使用方式： Message.info(‘提示’)； Message.error(‘错误’)； 1.修改index.html 注：添加 < div id=“message”></ 阅读全文

posted @ 2021-09-02 10:05 sk-xm 阅读(967) 评论(0) 推荐(0) 编辑

2021年8月12日

declare常见用法

摘要： declare就是告诉TS编译器你担保这些变量和模块存在，并声明了相应类型，编译的时候不需要提示错误 1.declare 如同 interface、type 关键词一样，在编译成 js 之后是会被删除的。 declare 声明的是一个变量 // 例子1： #index.html <script> v 阅读全文

posted @ 2021-08-12 11:56 sk-xm 阅读(3852) 评论(0) 推荐(0) 编辑

2021年8月11日

vue 实现点击复制文本

摘要： 1.引入插件clipboard.js方法如下：直接npm安装： npm install clipboard --save 2.在需要使用的组件中important 引用方法：import Clipboard from 'clipboard' 3.添加需要复制的内容例如： // data-clip 阅读全文

posted @ 2021-08-11 17:40 sk-xm 阅读(408) 评论(0) 推荐(0) 编辑

2021年6月28日

vue 组件属性 name的作用

摘要：组件是有name属性的，匹配的就是组件的name。和vue-router中配置的name是不同的含义。 1.当项目使用keep-alive时，可搭配组件name进行缓存过滤配置<keep-alive>标签的exclude或者include属性做组件筛选实例： <div id="app"> <ke 阅读全文

posted @ 2021-06-28 11:15 sk-xm 阅读(383) 评论(0) 推荐(0) 编辑

2021年4月12日

西瓜视频播放器（HTML5）

摘要： ###西瓜视频播放器（HTML5）一款带解析器、能节省流量的HTML5视频播放器 https://v2.h5player.bytedance.com/ ##播放视频 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name=vi 阅读全文

posted @ 2021-04-12 16:20 sk-xm 阅读(9027) 评论(0) 推荐(0) 编辑

2021年4月9日

闭包

摘要： ##关于闭包 ###1,闭包的理解 1,产生闭包? 当一个嵌套的内部(子)函数引用了嵌套的外部(父)函数的变量(函数)时,就产生了闭包. 2,闭包是什么? 理解1: 闭包是嵌套的内部函数(绝大部分人) 理解2: 包含被引用变量(函数)的对象(极少数人) 注意: 闭包存在于嵌套的内部函数中 3,产生闭阅读全文

posted @ 2021-04-09 13:04 sk-xm 阅读(71) 评论(0) 推荐(0) 编辑

2021年2月26日

react mobx全局状态管理

摘要： mobx react中全局数据管理库可以简单的实现数据的跨组件共享类似 vue中的vuex 使用步骤安装依赖 mobx 核心库 mobx-react 方便在react中使用mobx技术的库 @babel/plugin-proposal-decorators 让 rn 项目支持 es7 的装饰阅读全文

posted @ 2021-02-26 11:34 sk-xm 阅读(841) 评论(0) 推荐(0) 编辑

2021年2月20日

自定义hook

摘要：自定义hook hook就是一个函数,有一些特定逻辑的封装函数 1,用于处理字符串(url) 2,数据格式化(日期) 3,业务逻辑性 // 自定义hook相对于普通js复用逻辑的抽离,然后可以在页面调用 // 自定义hook一般放在src下面hooks文件夹里面 // 自定义 Hook 是一个函数，阅读全文

posted @ 2021-02-20 15:40 sk-xm 阅读(1202) 评论(1) 推荐(0) 编辑

2021年2月19日

WebSocket

摘要： HTML5 WebSocket WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。 WebSocket 使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者阅读全文

posted @ 2021-02-19 17:53 sk-xm 阅读(75) 评论(0) 推荐(0) 编辑

react-hook

摘要： ### 简介 Hook 在 class 内部是不起作用的。但你可以使用它们来取代 class 。 Hook 是一个特殊的函数，它可以让你“钩入” React 的特性。例如，useState 是允许你在 React 函数组件中添加 state 的 Hook。如果你在编写函数组件并意识到需要向其添加一阅读全文

posted @ 2021-02-19 17:32 sk-xm 阅读(77) 评论(0) 推荐(0) 编辑

2021年1月15日

Vue 路由导航守卫(全局守卫、路由独享守卫、组件内守卫)

摘要： ##一.全局守卫 ###1. router.beforeEach((to,from,next)=>) ###2. 回调函数中的参数，to：进入到哪个路由去，from：从哪个路由离开，next：函数，决定是否展示你要看到的路由页面。 ###3. 如下例：main.js中设置全局守卫在main.js中阅读全文

posted @ 2021-01-15 18:24 sk-xm 阅读(201) 评论(0) 推荐(0) 编辑

小茗同学

心若没有栖息的地方,到哪里都是流浪

公告