JavaScript
关注
分享
扫一扫
Saladbobo
这个作者很懒，什么都没留下…
展开
-
JSON树形结构搜索功能实现
搜索效果如下图所示,左图为搜索前树的内容，右图为搜索后树的内容 树形结构数据如下所示，如果根节点只有一个，最外层数组下只存一个Node对象即可：[{ id: 1, name: 'Node1', children: [ { id: 3, name: 'Node1_1', children: [ { id: ...原创 2019-07-05 10:35:33 · 5271 阅读 · 3 评论 -
yarn 安装全局包后找不到命令的问题
使用yarn安装一个全局包：yarn global add typescript在命令行输入tsc命令回车报错：C:\Users\Administrator>tsc'tsc' 不是内部或外部命令，也不是可运行的程序或批处理文件。解决方案：yarn global bin获取yarn全局安装包路径，添加到系统环境变量中。C:\Users\Admi...原创 2019-08-06 16:54:53 · 10411 阅读 · 0 评论 -
微前端 - 将微服务理念延伸到前端开发中
翻译自https://micro-frontends.org/本文描述了采用不同 JavaScript 技术框架的多个团队中协同构建一个现代化前端 Web 应用所需要的技术、策略和方法。什么是微前端？微前端这个术语最初来自 2016 年的 ThoughtWorks 技术雷达[https://www.thoughtworks.com/radar/techniques/micro-fr...转载 2019-08-06 13:48:40 · 304 阅读 · 0 评论 -
DIV内容居中
1.flex布局实现css代码.box{ width: 200px; height: 200px; display: flex; display: -webkit-flex; justify-content: center; align-items: center; background: #AAA;}.inner{ width: 100px; he...原创 2019-08-01 17:07:43 · 1559 阅读 · 0 评论 -
react-router-dom 重定向默认路由
<Layout> <Switch> <Route path='/' exact render={()=> ( <Redirect to='/home'/> )}/> <Route path='/home' component={Home} /> ...原创 2019-08-01 15:33:54 · 2400 阅读 · 0 评论 -
react异步加载组件
react异步加载组件1. 创建 asyncComponent 异步加载工具import React from 'react'function asyncComponent(loadComponent){ class AsyncComponent extends React.Component{ static defaultProps = { ...原创 2019-04-01 16:02:00 · 457 阅读 · 0 评论 -
Nginx支持 React browser router
Nginx支持 React browser router修改nginx配置文件，添加try_file配置如下，即可实现对 React browser router 的支持。location / { root /var/www/mysite; try_files $uri /index.html;}但是该方式也会存在缺点，只要/index.html存在，服务端就不会响...原创 2019-03-06 16:33:00 · 707 阅读 · 0 评论 -
Array prototype is read only, properties should not be added no-extend-native
有如下所示代码Array.prototype.indexOf = function (searchElement) { if (this == null) { throw new TypeError(); } var t = Object(this); var len = t.length >>> 0; ...原创 2019-08-01 15:18:22 · 9084 阅读 · 4 评论 -
图片上传前预览
效果图：实现思路：input 注册 onchange 事件， 在 onchange 事件中获取图片文件，然后通过 FileReader 转换为 Base64 编码，然后修改img 的 src内容实现图片上传服务器前预览功能。代码：<!DOCTYPE html><html lang="zh"><head> <style&...原创 2019-08-02 16:44:16 · 157 阅读 · 0 评论 -
JS 查找数组的父节点及祖先节点
JSON数据结构：[{ id: 1, name: 'Node1', children: [ { id: 3, name: 'Node1_1', children: [ { id: 8, name: 'Node1_1_1' }, { id: 9, name: 'Node1_1_2' }, { id: 10, name: 'N...原创 2019-06-14 15:16:46 · 5040 阅读 · 1 评论 -
Yarn 包管理器使用
初始化一个新项目yarn init添加依赖包yarn add [package]yarn add [package]@[version]yarn add [package]@[tag]将依赖项添加到不同依赖项类别中分别添加到devDependencies、peerDependencies和optionalDependencies类别中：yarn add [...原创 2019-07-07 11:08:17 · 213 阅读 · 0 评论 -
URLSearchParams 从 URL 获取查询字符串
URLSearchParams接口定义了一些实用的方法来处理 URL 的查询字符串。一个实现了URLSearchParams的对象可以直接用在for...of结构中，例如下面两行是相等的。for (var p of mySearchParams);for (var p of mySearchParams.entries());var url = new URL('htt...原创 2019-07-11 15:45:37 · 367 阅读 · 0 评论 -
React 使用 iconfont 实现自己的 SvgIcon 组件
1. IconFont新建自己的图标库项目2. 下载项目至本地将下载的压缩包解压，拷贝 iconfont.js 至自己的项目中，然后通过script标签在 index.html 中引入。此时在浏览器中 F12 调试查看源码，可以看看到body下多了一个 svg标签， 如下图所示，其中symbol即为项目中的svg元素。3. 实现 React SvgIcon 图标组件Sv...原创 2019-08-02 15:00:52 · 1233 阅读 · 0 评论