diff --git a/index.html b/index.html index d5e9fe9..0720549 100644 --- a/index.html +++ b/index.html @@ -104,7 +104,52 @@ 'https://gitee.com/-/ide/project/lingxyz/learning/edit/master/-/', null, '✍🏻' - ) + ), + /* 编辑插件 */ + function(hook, vm) { + var contents = '' + const editableDiv = document.createElement('div'); + // 每次开始解析 Markdown 内容时调用 + hook.beforeEach(function(content) { + contents = content + console.log(content) + return content; + }); + hook.doneEach(function() { + editableDiv.innerHTML = contents + }) + // 初始化并第一次加载完成数据后调用,没有参数。 + hook.ready(function() { + // 创建元素 + const div = document.createElement('div'); + div.style.display = 'none'; + editableDiv.contentEditable = true; + editableDiv.style.whiteSpace = 'pre-wrap'; + // editableDiv.innerHTML = contents + div.appendChild(editableDiv); + const button = document.createElement('button'); + button.innerHTML = '修改' + div.appendChild(button); + // 将div元素插入到x元素的最后面 + const sectionContent = document.querySelector('section.content'); + sectionContent.appendChild(div); + // 创建编辑按钮 + const editorButton = document.createElement('button'); + editorButton.innerHTML = '编辑' + const markdownSection = document.querySelector('.markdown-section'); + editorButton.addEventListener('click', () => { + div.style.display = 'block' + editorButton.style.display = 'none' + markdownSection.style.display = 'none' + }); + button.addEventListener('click', () => { + div.style.display = 'none' + editorButton.style.display = 'block' + markdownSection.style.display = 'block' + }); + sectionContent.insertBefore(editorButton, sectionContent.firstChild); + }); + } ] } diff --git a/web/_sidebar.md b/web/_sidebar.md index a3673b5..b671a1e 100644 --- a/web/_sidebar.md +++ b/web/_sidebar.md @@ -31,5 +31,5 @@ * SSG * **监控** - * [Sentry](sentry.md) + * [Sentry](web/sentry.md) * 埋点 diff --git a/web/javascript.md b/web/javascript.md index 3a687a5..026540c 100644 --- a/web/javascript.md +++ b/web/javascript.md @@ -9,6 +9,8 @@ Undefined、Null、Boolean、Number、String 1种复杂数据类型:Object ``` +[ECMAScript 6 入门](http://es6.ruanyifeng.com/#docs/intro ':include :type=iframe width=100% height=400px') + - [`ES6` 简介](http://es6.ruanyifeng.com/#docs/intro) - [let 和 const 命令](http://es6.ruanyifeng.com/#docs/let) - [变量的解构赋值](http://es6.ruanyifeng.com/#docs/destructuring) @@ -18,17 +20,16 @@ Undefined、Null、Boolean、Number、String - [Symbol](http://es6.ruanyifeng.com/#docs/symbol) - [Set 和 Map 数据结构](http://es6.ruanyifeng.com/#docs/set-map) -- 【ES7】 [ES7 and ES8 特性](https://www.jianshu.com/p/a138a525c287) - - [Array.prototype.includes](es7/Array.prototype.includes.md) - - [Exponentiation Operator(求幂运算(a ** = b) = a ** b = Math.pow(a, b))]() - +[ES7 and ES8 特性](https://www.jianshu.com/p/a138a525c287 ':include :type=iframe width=100% height=400px') + - Array.prototype.includes + - Exponentiation Operator(求幂运算(a ** = b) = a ** b = Math.pow(a, b)) - ES8(EcmaScript 2017) - - [String padding(字符串填充 padStart / padEnd)]() - - [Object.values / Object.entries]() - - [Object.getOwnPropertyDescriptors返回对象所有自身属性描述]() - - [Trailing commas(函数参数列表和调用中尾部的逗号)]() - - [Async Functions(异步函数)]() - - [共享内存和Atomics]() + - String padding(字符串填充 padStart / padEnd) + - Object.values / Object.entries + - Object.getOwnPropertyDescriptors返回对象所有自身属性描述 + - Trailing commas(函数参数列表和调用中尾部的逗号) + - Async Functions(异步函数) + - 共享内存和Atomics - [ES11](https://mp.weixin.qq.com/s/q8G82BJE1O6Kz031RNBLbw) ### 引用类型 diff --git a/web/qiankun.md b/web/qiankun.md index a5656ca..c8c4998 100644 --- a/web/qiankun.md +++ b/web/qiankun.md @@ -1,16 +1,19 @@ -# 背景 +## 简介 - [qiankun 官方文档](https://qiankun.umijs.org/zh) - [基于 single-spa](https://github.com/single-spa/single-spa) - 蚂蚁金服内部孵化,服务超过200+平台 -# 微前端集成 -- 主应用-加载微应用 -- 微应用-路由 -- 微应用-配置原则 -- 微应用-原生配置 -- 微应用-vue配置 +## 微前端集成 +### 主应用-加载-微应用 -# 微前端通信 +[在主应用中注册微应用](https://qiankun.umijs.org/zh/guide/getting-started#2-%E5%9C%A8%E4%B8%BB%E5%BA%94%E7%94%A8%E4%B8%AD%E6%B3%A8%E5%86%8C%E5%BE%AE%E5%BA%94%E7%94%A8 ':include :type=iframe width=100% height=300px') + +### 微应用-路由 +### 微应用-配置原则 +### 微应用-原生配置 +### 微应用-vue配置 + +## 微前端通信 - 账号打通 - 权限打通 - 绕开账号权限问题 @@ -21,11 +24,11 @@ ``` - 参数传递,安全性 -# 微前端部署 +## 微前端部署 - 微前端-部署 - 跨域解决 -# 微前端原理 +## 微前端原理 - HTML entry - JS 沙箱 - 样式隔离 diff --git a/web/entry.md b/web/sentry.md similarity index 100% rename from web/entry.md rename to web/sentry.md