随笔分类 -  Frontend

1 2 3 下一页

quasar 在 setup() 周期阶段想设置meta信息,如何获取当前的 route 参数动态设置
摘要:在Vue 3 的Composition API(组合式API)中,特别是在 setup() 钩子函数阶段, 由于没有访问到常规的 Vue 实例(this上下文),所以不能直接使用 this.$route 来获取路由信息。 但是,你可以通过 useRoute() 函数来访问当前活跃的路由对象: imp 阅读全文

posted @ 2024-03-07 23:41 ercom 阅读(74) 评论(0) 推荐(0)

[FAQ] CodeMirror5, CodeMirror6 EditorView 获取输入值和设置值的方式
摘要:获取值: // CodeMirror5 cm.getValue() 改为使用 // CodeMirror6 cm.state.doc.toString() 设置值: // CodeMirror5 cm.setValue(text) 改为使用 // CodeMirror6 cm.dispatch({ 阅读全文

posted @ 2022-12-05 00:38 ercom 阅读(1271) 评论(0) 推荐(0)

[FAQ] 在 Mac 系统上 yarn add canvas 安装失败的原因
摘要:当使用 yarn add 安装某个 node 库时,如果出现失败,多半是由于 nodejs 版本问题引起的。 现在我们可以使用 nvm 方便的管理不同的 nodejs 进行随时切换。 $ nvm ls-remote 可以查看所有的远程 nodejs 版本。 举例:如下使用 yarn add canv 阅读全文

posted @ 2022-11-30 19:22 ercom 阅读(522) 评论(0) 推荐(0)

[FE] 浅谈 Chakra UI 的现代化浅封装 - 语义化大行其道
摘要:Web2.0 发展至今,网页元素越来越丰富和多样化,数据越来越多。 从需求上来说,也已经不再是展示简单个静态网页,高效的开发交互、打通后端数据,产生了 React 和 Vue 两个著名框架。 React、Vue 这两个框架更多的是替代原本 JQuery 的位置,降低页面动态交互方面的复杂度。 而 U 阅读全文

posted @ 2022-11-27 22:05 ercom 阅读(143) 评论(0) 推荐(0)

[FAQ] Fontconfig error: Cannot load default config file
摘要:在使用一些第三方库时(比如生成图片),如果出现此提示,说明系统里缺少字体。 在 Ubuntu 上可以运行:$ apt-get install fontconfig 在 Centos 上可以运行:$ yum install fontconfig Tool:AI 编程助手 Ref:Fontconfig 阅读全文

posted @ 2022-10-25 19:38 ercom 阅读(2235) 评论(0) 推荐(0)

[FAQ] 如何从 svg 字符串创建 SVGElement
摘要:HTML 部分: <div style="display: none" id="svgCon"></div> JS 部分: const svgCon = document.getElementById('svgCon') svgCon.innerHTML = '<svg>xxxxx'; const 阅读全文

posted @ 2022-10-24 23:23 ercom 阅读(158) 评论(0) 推荐(0)

[FAQ] Quasar BEX Bridge 通信方式 this.$q.bex 未定义的问题
摘要:Bridge 是一个基于 Promise 的事件系统,在BEX的所有部分之间共享,允许在你的Quasar App中监听事件,从其它部分发出它们。 你可以使用 $q.bex 从你的 Quasar App中访问 Bridge。 在其他位置,Bridge 可以通过各自钩子文件中的 Bridge 参数来实现 阅读全文

posted @ 2022-09-25 16:45 ercom 阅读(63) 评论(0) 推荐(0)

浏览器扩展开发-Firefox临时载入附加组件(图)
摘要:科普:[FE] Quasar BEX 热加载区别: Chrome vs Firefox 1. 2. 3. Thats all. Refer:Firefox扩展开发 Link:https://www.cnblogs.com/farwish/p/15571577.html 阅读全文

posted @ 2021-11-18 11:40 ercom 阅读(203) 评论(0) 推荐(0)

[FAQ] 为什么部署到 github pages 时自定义域名总失效 (push-dir)
摘要:Github_Pages 能方便我们部署静态页面,并且还支持 CNAME 自定义域名。 $ yarn add --dev push-dir $ xxx build $ push-dir --dir=dist/spa --remote=gh-pages --branch=master 当我们每次 pu 阅读全文

posted @ 2021-11-15 23:37 ercom 阅读(642) 评论(0) 推荐(0)

[FE] nvm-windows: Microsoft/NPM/Google 推荐 Windows 的 Node.js 版本管理器, posix 的 nvm-sh/nvm
摘要:1. 到 github 下载 nvm-setup.zip 并安装。 Releases · coreybutler/nvm-windows (github.com) 2. 安装一个版本的 nodejs。 $ nvm install 14.0.0 3. 查看和切换版本。 4. 安装其它全局工具,比如 y 阅读全文

posted @ 2021-11-02 19:12 ercom 阅读(63) 评论(0) 推荐(0)

[FE] Quasar BEX 不同位置类型的 debug 调试方式
摘要:科普:[FE] Quasar BEX 所有位置类型 types 不同类型调试,查看错误在不同的位置,如下图中的 4 个位置。 Refer:https://quasar.dev/quasar-cli/developing-browser-extensions/build-commands#debugg 阅读全文

posted @ 2021-10-31 00:25 ercom 阅读(59) 评论(0) 推荐(0)

[FE] Quasar BEX 热加载区别: Chrome vs Firefox
摘要:Chrome 浏览器加载扩展程序时指定的是 src-bex 目录。Firefox 指定的是 manifest.json。 Quasar 提供的热加载特性是 修改 src/ 目录里的文件,src-bex/ 目录中的内容会自动更新。 此时 Firefox 扩展程序会自动生效,但是 Chrome 不会,需 阅读全文

posted @ 2021-10-31 00:14 ercom 阅读(178) 评论(0) 推荐(0)

[FE] Quasar BEX 所有位置类型 types
摘要:科普:[FE] Quasar BEX 预览版指南 New Tab Quasar BEX 的默认类型是 New Tab,在新 tab 栏里打开内容。 Dev Tools 也就是在开发者栏里面的内容。 Options 浏览器扩展可提供的设置页。 Popup 点击浏览器标签栏的浏览器扩展图标,显示出的一个 阅读全文

posted @ 2021-10-30 21:50 ercom 阅读(60) 评论(0) 推荐(0)

[FE] uni-app 安装 uview-ui 的两种方式
摘要:一. 下载的方式安装 就是把源码放到项目根目录中,然后引入 scss、js,并配置 easycom 模式。 https://www.uviewui.com/components/install.html 二. npm的方式安装 就是用 npm 安装 package 包,然后引入 scss、js,并配 阅读全文

posted @ 2021-10-26 08:33 ercom 阅读(654) 评论(0) 推荐(0)

[FE] Canvas 转图片并下载的方式
摘要:先获取 canvas 节点,使用 toDataURL 转为 image 数据,最后使用 a 链接下载。 // Trans to image const canvas = document.getElementsByTagName('canvas')[0] const link = canvas.to 阅读全文

posted @ 2021-10-19 21:49 ercom 阅读(312) 评论(0) 推荐(0)

[FE] jsoneditor 在 vue-router 和 vue-ssr 渲染下出现两个实例的问题
摘要:由于 vue-router 页面是无刷新的,如果存在两次渲染,会出现如下情形。 简单粗暴的解决办法是通过判断容器中是否已经有了子节点。 此时再从其他 router link 返回就不会重复渲染了。 My Answer:https://github.com/josdejong/jsoneditor/i 阅读全文

posted @ 2021-10-09 22:30 ercom 阅读(182) 评论(0) 推荐(0)

[FE] Quasar 性能优化: 减小 vendor.js 尺寸
摘要:默认情况下,出于性能和缓存的原因,Quasar 所有来自 node_modules 的东西都会被注入到 vendor 中。 但是,如果希望从这个 vendor.js 中添加或删除某些内容,可以如下这样做。 // quasar.conf.js return { vendor: { /* optiona 阅读全文

posted @ 2021-10-08 23:25 ercom 阅读(296) 评论(0) 推荐(0)

[FAQ] Quasar 组件 q-select 如何触发 onChange 事件
摘要:Quasar 文档都提供了组件的可用参数和事件、方法。 qSelect(q-select) 并没有 @change 事件,需要使用 @update 事件,注意用法。 <q-select v-model="single" :options="['def', 'abc', '456', '123']" 阅读全文

posted @ 2021-10-08 22:51 ercom 阅读(1261) 评论(0) 推荐(0)

[FAQ] jsoneditor 如何切换 mode 或者选择 modes
摘要:1. 用于切换编辑器模式:text、tree、code JSONEditor.setMode(mode) 2. 让 mode 变成可以选择的: const options = { modes: ['text', 'code', 'tree'] } 示例:在线JSONEditor Ref:https: 阅读全文

posted @ 2021-10-07 12:58 ercom 阅读(429) 评论(0) 推荐(0)

[BEX] Quasar BEX 提供的那些配置
摘要:Manifest.json https://developer.chrome.com/extensions/manifest Background Script & Content Script Background Script - 运行在BEX本身的上下文中,可以监听所有可用的浏览器扩展事件。每 阅读全文

posted @ 2021-06-22 23:15 ercom 阅读(161) 评论(0) 推荐(0)

1 2 3 下一页