利用Stompjs与Mq通信记录 近期遇到需要前端直接与Rabbitmq创建连接实现一个聊天框的功能实现，Rabbitmq官网提供http/web-stomp协议应用于web端与Rabbitmq通讯，下面前端开发围绕着stomp协议展开。 官网文档参考 RabbitMQ Web STOMP Plugin — RabbitMQ 实时通信的三种解决办法： Ajax轮询：此技术通过设置浏览器周期性地向服务器发送请求，以检查是否 2023-12-10 JavaScript Vue Websocket
Webpack分包配置记录 拆包的目的 将更新频率较低的代码和内容频繁变动的代码分离，把共用率较高的资源也拆出来，最大限度利用浏览器缓存。 减少 http 请求次数的同时避免单个文件太大以免拖垮响应速度，也就是拆包时尽量实现文件个数更少、单个文件体积更小。 第二点实现文件个数少和单个文件小实际是矛盾的，因此要结合实际情况来处理，比如就可以利用webpack-bundle-analyzer来分析打包后的数据并进行调试 VUE 2023-07-08 JavaScript Vue webpack
前端打印组件记录 之前遇到过一个前端打印页面局部内容的需求，用windos.print 与 vue-print-nb都存在没有彻底解决包括样式显示异常，缩放比例不对等问题，切需打印内容是之前已经写好的，在做对应修改需要花费的时间更长，最后从网上找到一个htmlToCanvas 与 jsPDF的方法并结合实际情况用插空白元素的方法解决了分页问题才完成了需求，该方法也存在缺陷，就是文件是图片转化来的不能进行选择，不过客 2023-04-05 JavaScript Vue
Vue中icon图标问题的解决过程 公司组件做法将地债实现相关代码记录下来方便之后使用，环境为 vue2 + webpack4 安装svg-sprite-loader，在vue.config.js中添加如下数据 1234567891011121314151617module.exports = { chainWebpack: config => { // 对svg的处理 具体实现 <sv 2023-03-07 Vue SVG
React Hooks 学习总结 useState基本使用: 12345// 这里可以任意命名，因为返回的是数组，数组解构const [state, setState] = useState(initialState);const [n, setN] = React.useState(0);const [user, setUser] = React.useState({ name: '张三'  2023-02-26 React
Redux 概念-纯函数函数式编程中有一个非常重要的概念叫纯函数，JavaScript符合函数式编程的范式，所以也有纯函数的概念 在react开发中纯函数是被多次提及的 比如react中组件就被要求像是一个函数式（为什么是像，因为还有class组件），redux中有一个reducer的概念，也是要求必须是一个纯函数 所以掌握纯西数对于理解很多框架的设计是非常有帮助的； 纯西数的维基百科定义： 在程序设计 2023-02-25 React Dedux
React ref与受控组件 Ref 类组件可以通过ref直接获取到实例，这里推荐使用useRef方法 函数式组件因为没有实例无法获取到组件实例，但是可以通过forwardRef获取到组件内部某个标签，可以称之为Ref的转发，具体用法见下图 受控与非受控组件什么是受控组件 在HTML 中，表单元素（如<input>、＜textarea＞ 和<select>）之类的表单元素通常自己维护 state 2023-02-19 React
React setState的同步与异步 setState的同步和异步首先我们要知道为什么React中要使用setState来修改数据，简单来说原因包括如下几点： 因为我们修改了state之后，希望React根据最新的State来重新渲染界面，但是这种方式的修改React并不知道数据发生了变化 React并没有实现类似于Vue2中的Object.defineProperty或者Vue3中的Proxy的方式来监听数据的变化 我们必须通过s 2023-02-19 React
React 组件化 组件分类React的组件相对于Vue更加的灵活和多样，按照不同的方式可以分成很多类组件： 根据组件的定义方式，可以分为：函数组件(Functional Component )和类组件(Class Component) 根据组件内部是否有状态需要维护，可以分成：无状态组件(Stateless Component )和有状态组件(Stateful Component) 根据组件的不同职责，可以分成： 2023-02-18 React
React JSX JSX是什么 JSX是一种JavaScript的语法扩展(eXtension),全称为JavaScript XML JSX的书写规范 JSX的顶层只能有一个根元素，所以我们可以在外层包裹一个div元素(或使用Fragment) 为了方便阅读，我们通常在jsx的外层包裹一个小括号()，这样可以方便阅读，并且jsx可以进行换行书写 JSX中的标签可以是单标签，也可以是双标签(注意:如果是单标签，必须 2023-02-12 React
