『前端实习笔记』3月 第3周

最新推荐文章于 2025-02-28 15:54:31 发布
最新推荐文章于 2025-02-28 15:54:31 发布
阅读量726 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 前端实习笔记
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/GLZX_HM/article/details/115753343
这周的实习笔记主要记录了使用codemirror@6的体验，包括readonly特性，组件设计与边界处理，以及遇到的各种bug修复。在组件开发中，强调了props的处理和类型检查的重要性，还提到了Vue3 JSX的支持和git操作的问题。周报总结了codemirror的通用组件、YAML和Python编辑器的优化，以及告警通知状态的调整。

文章目录

日记


3.15

  • codemirror@6 readonly
EditorView.editable.of(false)

看了源代码得出

  • case转换快捷键
    camelCase和kebab-case切换的，vscode可以设置

  • 小bug修复
    yaml编辑器行数不对其
    python编辑器active行数小，因为高度是div撑开的，而非内容本身


3.16

  • 通用组件
  1. 考虑组件的边界
    这里因为配置是覆盖的，所以根据props做了A和C，让用户自定义部分为B
    优先级是A-B-C
  2. 设计
    50%时间做设计
    写出文档readme.
了解本专栏 订阅专栏 解锁全文 超级会员免费看
『前端实习笔记』11月 第3周
猪窝
11-30 988
文章目录日记11.1611.1711.1811.1911.20周报 日记 11.16 code review 个别代码嵌套层数过多，个别代码嵌套层数太少：本来放一个文件模块能解决的事情，来来回回引了好几次，放了好几个没用的文件来回引来引去；一个函数方法，里面包含了大概3个部分，分别对应不同的操作，我直接写在一起了，应该把他们再拆成3个函数。 import引入顺序太乱了。库相关的放在最前，css类的放在中间，本地文件放在最后，每一个part之间空出一行。逻辑清晰。 下面以我的demo为例：(有些库本地
『前端实习笔记』12月 第3周
猪窝
12-25 570
文章目录日记12.1412.1512.1612.1712.18周报OJ 日记 12.14 任务：调研vega-lite库，增加动态渲染表格，按钮控制，可取最大最小值 过程 tooltip收尾：因为我搞编译器耽搁了，碰到致命错误，但没说。leader让我下次碰到这种错误第一时间告诉他。 加表格：简单的很，每一列加一个按钮控制是否显示。这里唯一注意的就是，表格渲染必然是v-for，而控制是否显示有两个v-if和v-show，文档里再三强调v-for不可以和v-if同时出现，其他case下v-if用于惰性
使用 CodeMirror 只读模式的最佳实践
qq_22841387的博客
12-03 9510
通过这次的实践，我深刻体会到了在开发中深入理解工具的每一个细节是多么的重要。CodeMirror 作为一个强大的代码编辑器，通过简单的配置，就可以实现多种需求。在使用它的过程中，我们需要仔细阅读官方文档，了解每一个配置项的作用，并根据实际需求灵活应用。希望这篇文章能帮助你更好地理解和使用 CodeMirror，尤其是在 Vue 项目中的应用。
前端第三周学习总结
weixin_52226680的博客
06-06 358
学习了框架，div以及css各种属性等相关知识。 框架是一种特殊的网页，它可以根据需要把浏览器划分为多个区域，每个框架区域都对应一个单独的网页。框架由框架集和单个框架组成。 div全称Division，意为“区分”，它是用来定义网页内容中逻辑区域的标签，可以通过插入div标签并对它们应用的css样式来创建网页布局。 css的属性包括类型、背景、区块、方框、列表、定位、扩展、过渡等属性。 ...
使用 CodeMirror 6 和 React 构建一个支持只读模式的 JSON 编辑器
最新发布
qq_48691693的博客
02-28 1362
CodeMirror基本使用
『前端实习笔记』3月 第1周
猪窝
03-08 700
文章目录日记3.13.23.33.43.5周报 日记 3.1 code-review map写法有问题 我在function里return了new Map()，这样每次调用都会创建新的，虽然V8优化了 switch写法巨丑，不要用 map的写法最后决定放在computed里，因为创建一次也不会修改，没有对应响应式的数据 Vue中$_开头的不会触发reactive chain a.b.c.d式引用起来很慢的，尤其是循环 能解构就解构 任务：bug check一处模板为何渲染刚开始为undefi
『前端实习笔记』3月 第4周
猪窝
04-16 585
文章目录日记3.223.233.243.253.26周报 日记 3.22 遗留问题 PR没合，包含了测试分支的修改内容 测试分支也没删 字段修改 缺乏最佳实践，后端频繁更换字段或取值时兼容适配始终是个大问题 如果是db直接更新还好，就怕要兼容旧的数据 state-dot 3个时间状态 uplot-width 帮后端手动过滤展示 逻辑梳理： @当前告警 firing 有最近告警时间 读event_updated_at @历史告警 resolved 有开始时间 有结束时间 读event_star
『前端实习笔记』12月 第2周
猪窝
12-25 741
文章目录日记12.712.8tt12.912.1012.11周报 日记 12.7 任务：根据d3和vega-lite画图 d3 d3 API vega-lite vega-lite API 过程 引入：在文档的usage部分找NPM的引入方式，这里要到vega，vega-lite，vega-embed这三个NPM页面仔细看一下。文档tutorial部分是指导，examples部分可以找到很多示例，doc部分是所有文档以及API。 示例：例子多是JSON写法，可以转用JS的对象写法，用pre
codemirror6教程
qq_43203949的博客
11-30 5746
视图用于展示文本的，在中文本信息的展示使用的是这个类在codemirror6中，文本信息放到了这个类，可以展示在之上，改变里面的文本，可以更改页面上的文本展示。 EditorState 编辑器状态，描述当前编辑器使用的插件，文本等信息 EditorView 编辑器视图，编辑器的展现 Compartment 一个特殊的插件类，也叫隔层，用于封装真正的插件，当插件传入EditorState后，我们是无法直接动态改变里面的插件的，如果要改变里面的插件，就需要用到Compartment封装插件。 Compartm
codemirror 常见操作
Touatou的博客
08-07 1万+
0.定义一个包含codemirror的文本框： 1.获取codemirror这个对象： var editor = CodeMirror.fromTextArea(document.getElementById("code"), { lineNumbers: true, extraKeys: {"Ctrl": "autocomple
SvelteCodeMirror6:这是一个测试Svelte应用程序，用于为Svelte创建CodeMirror 6组件
05-10
SvelteCodeMirror6 这是一个测试Svelte应用程序，用于为Svelte创建CodeMirror 6组件。 首先，安装所需的库： npm i 要编译项目，请输入： npm run build 要为该项目运行开发服务器，请输入： npm run dev 之后，您可以进入公共目录并使用NW.js启动它： cd public nwjs . 假设您有一个nwjs的别名，以指向系统上的NW.js。
CodeMirror用户手册
LingMax的博客
05-02 2万+
用户手册和参考指南版本5.46.1 CodeMirror是一个代码编辑器组件，可以嵌入到Web页面中。核心库仅提供编辑器组件，不提供伴随按钮，自动完成或其他IDE功能。它确实提供了丰富的API，在此基础上可以直接实现这些功能。有关额外功能的可重用实现，请参阅分发中包含的插件和外部托管插件列表。 CodeMirror使用特定于语言的模式。模式是JavaScript程序，可帮助用给定语言编写的文本...
vue3+codemirror6中编辑器不可编辑状态的实现
jjking1994的博客
06-26 1556
意思是这个属性不要和EditorView中的editable混淆了，这样是不是说明这两个属性实现的效果是不同的？答案是肯定的，这两个属性的区别在于设置EditorState.readOnly的编辑器为不可编辑，但是还是会有光标闪烁，而设置了EditorView.editable的编辑器为不可编辑且不会有光标闪烁。当然，这里的不可编辑指的是不可在编辑器中实时编辑，如果通过调用示例代码中的setInput方法强制给编辑器赋值也是可以更新编辑器的内容的。为false，即在extensions的数组中加入。
记录CodeMirror一些常用的配置选项
前端笔记——放弃很容易,但坚持一定很酷
04-07 3357
mode：设置编辑器的语言模式，例如JavaScript、HTML、CSS、Markdown等。 theme：设置编辑器的主题，例如ambiance、eclipse、monokai等。 lineNumbers：设置是否显示行号。 readOnly：设置是否只读。 gutters：设置编辑器的侧边栏，例如显示行号、代码折叠等。 matchBrackets：设置是否高亮匹配的括号。 autoCloseBrackets：设置是否自动闭合括号。 extraKeys：设置自定义快捷键。 lint：设置
CodeMirror使用说明书
热门推荐
AlexS Blog
05-09 9万+
本文介绍CodeMirror使用方法，以及内部常用属性和api的使用
vue-codemirror6 + Vue3 代码编辑器
m0_56772756的博客
09-03 3311
/ 输入的字体颜色"&": {},},// 激活背景色},// 激活序列的背景色},//光标的颜色},// 选中的状态},// 左侧侧边栏的颜色color: "#ddd", //侧边栏文字颜色。
codemirror6及公式编辑器 001 codemirror6
PRIEST_KNIGHT的博客
07-02 2669
在使用codemirror6时收集到的一些资料和踩坑，这里有些事提炼了其他大佬们的文章，链接我已经给出来了
vue中使用CodeMirror解析yaml语言
个人博客
06-22 7807
下载插件： 这里使用的是codemirror5，现在codemirror最新已经是6了，不过参考文档相对较少，使用起来不是那么方便。后续文档丰富之后可以考虑使用6这里使用到的配置如下 三、CodeMirror具体使用 1.首先创建一个textarea标签 2.然后引入相关依赖 3.最后初始化编辑器 四、CodeMirror语法校验 1.引入语法校验依赖 codemirror支持的校验库如下 3.安装lint需要的其他依赖 仅仅是这样还是不够的，因为codemirror对应的校验插件中可能还依赖其他
Codemirror6个人使用心得总结
盧瞳的代码博客
01-17 2036
Codemirror6对原有的包进行了拆分，和原有的使用方法有较大差异，本文记录个人在使用过程中的心得
吴跟强实习笔记：拍卖管理系统开发与SSM框架学习
这篇实习笔记记录了学生吴跟强在2017-2018学年第2学期参与的企业级银行项目实践，其中专注于拍卖管理系统项目开发。在这个过程中，吴跟强深入学习并实践了SSM框架（Spring+SpringMVC+MyBatis），并负责工具类的导入...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

大熊软糖M

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值