- 博客(416)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 【react】react和vue的最大区别
一直都是两者都在用，现在基于自己的一些使用体验，说一下两者的本质区别首先我们看vue：vue最核心的部分就是它的双向绑定，defineProperty和后来的Proxy让getter搜集依赖，setter触发更新等于是视图的更新，都交予了框架自己去完成然后我们在看react：react将setter外置，等于触发更新的时机可以coder自己决定而且如果想用双向绑定也可以像vue一样实现一个类似的reactive像ahooks里的useReactive这样选择就变得就更多样，然后在
2022-04-08 09:07:33
1020
2
原创 【react】useEffect和async/await
如果要在useEffect中使用异步函数，大致有两种方法使用自执行函数在useEffect内外创建异步函数，然后调用(1)自执行函数 useEffect(() => { (async function myFunc() { await loadContent(); })(); }, []);(2)创建异步函数变量，执行可以写在useEffect里，也可以写在外边调个人比较喜欢直接在里边包一层useEffect(() => { const
2022-04-08 08:58:41
1764
原创 【tools】brew最简安装方案
使用别人写好的脚本，直接有源的选择和工具安装过程脚本中会提示，只需要一行代码，然后按照提示走就可以了/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewCN/raw/master/Homebrew.sh)”
2022-04-07 10:24:29
135
原创 【android】BridgeWebView加载本地h5出现webpage not available
首先，androld模拟器自成体系，类似一个虚拟机它的localhost指向的是模拟器本身而不是你的笔记本。所以一般解决的方法是查看你电脑的网络偏好设置，取用你pc的局域网地址。然后作为要挂载的url去load。当然也有一些前置操作要去做例如网上很容易找到的，minifest文件中加： <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:nam
2022-04-07 09:14:42
3420
原创 【android】wrap_content和match_parent
wrap_content:是layout_width和layout_height的属性值之一，表示和自身内容一样的长度。<TextView android:textSize="18dp" android:layout_marginRight="50dp" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="User 值：" />m.
2022-04-07 09:01:56
2079
原创 【vue】解决跨域问题的原理
vue中的proxy主要作用类似于nginx； 将本地请求转发跟随vue项目启动的本地服务； 然后由服务端去请求远程服务端；而本地服务和本地H5资源，因为同源，所以没有跨域的问题
2021-12-01 16:59:54
2536
1
原创 【js/css】CommonJS/AMD/CMD/UMD/ESM 模块化规范的区别
CommonJS 是同步的，只需要从项目文件夹读取就可以了，用时较短，但是浏览器端，需要从服务器端加载，如果js标签没有同步走完，页面假死，所以需要另外的方案，这就催生出AMD和CMD这些异步方案AMD推崇依赖前置，基于RequireJS，在定义模块的时候就要声明其依赖的模块。CMD推崇就近依赖，基于SeaJS，只有在用到某个模块的时候再去require。UMD就是一种兼容 CommonJS/AMD/CMD 的兼容写法ESM 设计思想是尽量的静态化，使得编译时就能确定模块的依..
2021-11-29 11:37:17
505
原创 【js/css】渐变色linear-gradient简明教程
经常的一些使用注意这个角度是顺时针旋转的，初始是竖直，颜色从下到上(1)角度0，颜色方向是竖直从下到上background:linear-gradient(0deg, red 0%, blue 100%);(2)角度为90，颜色顺时针旋转，变为水平从左到右所以90度是从左到右的background:linear-gradient(0deg, red 0%, blue 100%);(3)角度为180，颜色顺时针旋转，变为竖直从上到下所以180度是从上到下的background:li
2021-11-17 14:38:22
1490
原创 【js/css】js和原生通信的一般方法大纲
js和原生通信的一般方法：原始的js和native的通信，有三种模式sheme url弹框事件监听注入上下文实际上比较好用的是注入上下文，这个依赖于ios和android注入的引擎，jsc和jsi官方给的方法当然我们也可以使用三方工具，像jsbridge我们先给ios和android安装包含jsBridge的工具内部实际上使用的是WebViewJavascriptBridge这个包，只不过对于注册和调用统一设置了api一般我们的js文件是放在webview上的，所以我们的js
2021-10-28 17:57:55
1312
原创 【vue】父子通信中的发布订阅
父组件中写一个监听v-on:key = callback 子组件中发布this.$emit("key",value)发布订阅的话自己写了也比较多，yarn add qc-event-bus用法和上边类似，可以看文档qc-evnet-bus还写了一种异步转同步的发布订阅yarn add async2syncasynctsync...
2021-10-27 17:50:25
147
原创 npm：including for package installation – must use TLS 1.2 or higher
看到TLS就明白了，这是让我们设置源为https，so：npm config set registry https://registry.npmjs.org/如果默认淘宝源，只是登录和提交，可以：npm login --registry https://registry.npmjs.orgnpm publish --registry https://registry.npmjs.org...
2021-10-12 09:40:12
1294
原创 【vue】provide && inject
provide和inject主要是为了高阶插件和组件库提供用例，但是也可以用于业务中，例如将祖先组件的this，暴露给子孙组件以便可以获取祖先组件的data在祖先组件中provide：------------------------------------ data() { return { color: "blue" }; },------------------------------------- provide() { return {
2021-10-11 10:48:44
91
原创 【js/css】css截取一张图片的底部显示
//图片资源这里就不写了...width: 100%;height: 146px;background-repeat: no-repeat;background-position: 0 -146px;//从底儿开始background-size: cover;
2021-10-08 16:46:08
273
原创 mysql之where和having的区别
首先HAVING子句只能出现在GROUP BY子句之后，用来作为GROUP BY的筛选条件，和WHERE主要有两方面的区别(1)WHERE子句设置的查询筛选条件在GROUP BY子句之前发生作用，并且条件不能使用集合函数(2)HAVING子句设置的查询条件在GROUP BY子句之后发生作用，并且条件中允许使用集合函数...
2021-10-04 11:51:28
90
原创 mysql之交易
交易事务维持一个事件流，使得交易在没有最终commit达成前可以反悔或中断，而自己口袋里的钱保持不变直接一个例子开场吧：-- 创建银行账户表create table bank_account( id int primary key auto_increment, cardno varchar(16) not null unique comment 'bank card number', name varchar(20) not null,
2021-09-29 10:50:21
194
原创 建靶和打靶
注意力需要有一个去向，这样才不会被浪费，so、每天坐到那第一件事一定不是干活，而是写一个todo list。先确定好目标，才算是有的放矢；这样注意力有了落脚点才不会慌张。目标可以多写几条，然后选三条，每个人都有一套自己做权重的方法，紧急、成长、工作等等...
2021-09-27 16:00:00
78
原创 mysql之列类型
列类型，其实指的是数据类型,主要是以下三种一、数值型又分为整数型和小数型(1)整数型tinyint：迷你整型，使用 1 个字节存储数据（常用）；smallint：小整型，使用 2 个字节存储数据；mediumint：中整型，使用 3 个字节存储数据；int：标准整型，使用 4 个字节存储数据（常用）；bigint：大整型，使用 8 个字节存储数据。字节数分别是1、2、3、4，然后一个4的两倍8(2)小数型小数型又分为浮点型和定点型浮点型：小数点浮动，精度有限，容易丢失精度；定点
2021-09-27 14:33:59
1292
原创 mysql之外键
外键的定义：如果一张表中有一个非主键的字段指向另外一张表的主键，那么将该字段称之为外键基本语法：foreign key(外键字段) + references + 外部表名(主键字段);todo
2021-09-27 09:40:28
144
原创 mysql列属性之唯一键
首先说特征：一张表往往需要多个字段具有唯一性，但是只有一个主键唯一键就是用来解决表中多个字段需要具有唯一性的问题。和主键的区别在于：唯一键允许字段值为空，并且允许多个空值存在。首先还是追加唯一键和删除唯一键的方法：--追加alter table tableName add unique key(xxx)--删除alter table my_unique3 drop index number;--这里和主键做一点区分的是这里是drop index + 列属性--因为唯一键可能有多个两
2021-09-26 17:23:38
838
原创 mysql列属性之自增长
auto_increment当对应的字段，不给值，或者是默认值，或者是null的时候，就会自动的被系统触发，系统会从当前字段中取已有的最大值再进行+1操作，得到新的字段值。自增长通过跟主键进行搭配使用，其特点为：任何字段要做自增长，前提其本身必须是一个索引，即key栏有值；自增长字段必须是数字（整型）；每张表最多有一个自增长字段。...
2021-09-26 16:29:19
467
原创 mysql列属性之主键
先来回忆一下表操作里讲到的主键的追加和删除//添加alter table tableName add primary key(course)//删除alter table tableName drop primary key然后我们先说一下主键的特征，方便使用的时候catch每张表只有一个字段使用此属性(复合主键，一次设置多个的除外)，用来唯一的约束该字段里边的数据，不能重复常和auto_increment合用上边是追加的方法，另外两种创建的方法也很简单：(1)在声明列属性的时候额外声
2021-09-26 16:22:44
181
原创 【react】yarn run eject
eject命令可以将webpack的配置从黑盒变成白盒，将webpack等配置信息从react-scripts中暴露出来，可以自己配置微博pack的loader和出入口以及插件等内容；eg：关闭严格模式 在config/webpack.config.js中关闭eslint的loader/* { test: /\.(js|mjs|jsx|ts|tsx)$/, enforce: 'pre', use: [ { options: { formatter:
2021-09-17 10:48:53
298
原创 【js/css】pushState和popState简明教程
pushState和replaceStateh5中提供了只修改地址栏、不修改页面内容的api:pushState(添加浏览历史),replaceState(修改当前浏览历史)，popState事件在用户返回或前进进会被出发触发history.pushState方法接受三个参数，依次为：state：一个与指定网址相关的状态对象，popstate事件触发时，该对象会传入回调函数。如果不需要这个对象，此处可以填null。可用它来传一些数据title：新页面的标题，但是所有浏览器目前都忽略这个值，
2021-09-16 09:46:14
3113
原创 【js/css】当前选中居中短下划线
1.效果2.css实现 .item-selected{ font-size: 18px; font-weight: bold; color: white; //给当前元素添加相对定位,也就是after的父级 position: relative; &:after { content: " "; width
2021-09-06 11:46:03
796
原创 【vue】微信sdk中接口和标签本地调试
1.首先改变本地host映射下载：switchHostswin上切换失败是因为权限不够1.找到host文件C:\Windows\System32\drivers\etc2.右键host，点击属性，选择安全 （在 2.右键host，点击属性，选择安全 这里加点操作 要把"常规"中的"属性"的只读不勾选,否则还是不能切换成功）3.赋予User所有权限------------------------------------mac的话更方便，输入本机密码就可获取权限2.在switchHo
2021-08-13 13:12:02
419
原创 【vue】v-html图片显示过大，左右滑动
最近接受后台html，然后显示的时候图片大小超过了边界，出现了左右滑动的情况，以下写法可以解决问题<style scoped> .zhengwen >>> img { max-width: 100%; height: auto; }</style>
2021-07-13 15:32:57
775
原创 【js/css】装饰器全解
装饰器模式是结构型的设计模式之一；结构型设计模式的主要特定就是给外挂，尽量不改动原代码；使用的时候在转译阶段还需要一些操作，主要有两种方法：tsbabel我们这里先分别说下这两种：ts使用tsc转译下npm i typescript -gtsc flat-1-1-装饰器使用.ts文件夹出现了flat-1-1-装饰器使用.js用node运行这个js文件就可以了babelnpm install babel-preset-env babel-plugin-transf
2021-07-07 09:56:53
233
原创 【vue】角标
template <div class="msg"> <img src="../../static/fx.png" /> <div class="alarm"> 500 </div> </div>css<style scoped> .msg { position: relative; } .msg img { width: 42px; height: 42px; } .alarm {
2021-07-01 09:34:04
1016
原创 【vue】路径别名配置和本地、网络图片显示
vue.config.jsconst path = require("path");const resolve = dir => path.join(__dirname, dir)module.exports = { chainWebpack: (config) => { config.resolve.alias // 添加别名 .set('@', resolve('src')) .set("@libs",resolve('src/l
2021-06-29 10:56:02
420
原创 【js/css】实现一个上下左右都居中的点
<view style="padding-left:12px;padding-right:12px;font-weight:bold"> ·</view>中间这个点是输入法输入dian，然后查找出来的，并不需要用css去一点点搞；主要看个人怎么搭配了
2021-06-24 14:45:38
470
原创 【vue】弹性布局实现自适应高度cell
如果弹性布局可以换行；flex-wrap: wrap;行间距离就不是align-items控制而是align-content: flex-start来控制了.scroll{ height: 1140px; width: 100%; box-sizing: border-box; padding-left: 12px; padding-right: 12px; display: flex; justify-content: space-between; flex-wrap: wra
2021-06-24 11:18:32
887
原创 【vue】element对一行的单个数据进行v-if判断
主要是提供了slot-scope来获取当前row对应的值然后具体在一行中判断某个值的时候，用scope.$index, scope.row来拿eg：v-if=“scope.row.name != 'xxx” <el-table-column min-width="50%" align="center" label="操作"> <template slot-scope="scope"> <el-button
2021-06-17 10:34:59
2252
原创 【vue】鼠标悬停加阴影样式
目标：实现当鼠标悬浮，给所在block边上加上阴影的效果；分析：这种一般都是逻辑层和渲染层一起努力逻辑层给个mouse_index，当和当前block的index匹配的时候，就通过:class="mouse_index==index?'item-sel':'item'"来作样式切换效果：代码：(1) template：<div class="disp"> <div :class="mouse_index==index?'item-sel':'item'"
2021-05-17 09:50:04
2282
1
原创 【vue】background-image的require动态引入
用require动态引入真麻烦 data() { return { header:require("../assets/header.jpg"), }; }, <div class="header" :style="{backgroundImage:`url(${header})`}"> </div>
2021-05-12 18:14:53
2838
2
原创 【com】require和import，动态和静态
一、require和import的区别require用于读取并执行js文件， 并返回该模块的exports对象， 若无指定模块， 会报错。CommonJS规范加载模块是同步且动态的， 只有加载完成， 才能执行后续操作。可以在代码中引入import用于引入外部模块， 其他脚本等的函数， 对象或者基本类型。import属于ES6的命令， 它和require不一样， 它会生成外部模块的引用而不是加载模块，等到真正使用到该模块的时候才会去加载模块中的值。二、动态引入和静态引入webpack支持node的c
2021-05-12 17:51:21
2139
2
原创 【vue】vue组件和vue实例的关系
组件是扩展的 Vue 构造器，“扩展”的含义就是根据自己的需要去定制Vue构造器MyComp=Vue.extend({template:'<div>我就是组件</div>'})模板中的<MyComp>...</MyComp>是实例化组件的一种方法,相当于:new MyComp() so 实例化的组件就是vue实例PS：这里还可以补充一下vuexvuex的实质就是没有扩展template的Vue组件...
2021-05-06 16:32:23
600
原创 【vue】Vue.observable 超简单状态管理
讲起这个主要是在一些微服务框架中可以进行状态管理的再封装1.首先在man.js里边（当然也可以单独拿出来）//最小化的跨组件状态管理器,一处变化全局改变const obser = Vue.observable({ count: 0, name:"qc",})Vue.prototype.$obser =obser;2.在具体组件中1.template<button @click="setCount" style="margin-top:50upx;width:100%"
2021-04-22 11:07:32
274
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人