notelive vue版本开发

技术点

实时写入到本地存储,然后在阶段性的同步到服务器 vue中的watch方法 实时同步存储数据 - front-gl - 博客园 客户端存储 — Vue.js

localstorage的更加特性化功能实现,增加了keys等操作; yarkovaleksei/vue2-storage

vuejs-templates Simple Todo App with Vue - CodeSandbox vue-axios

开发中的技巧

让webstorm 识别vue cli3项目中的@路径别名正确解析的配置方法

获取localStorage中的key:Object.keys(localStorage)version

vue知识沉淀

“:” 是指令 “v-bind”的缩写,“@”是指令“v-on”的缩写;“.”是修饰符。详细如下 https://blog.csdn.net/yangfengjueqi/article/details/86536347

emit 触发一个事件,可以通过v-on监听 https://www.cnblogs.com/sweeneys/p/10201458.html

高亮编辑器

选择使用 vs的Monaco Editor

vue 代码编辑器monaco-editor使用 Package - monaco-editor-vue

Vue cli2.0 项目中使用Monaco Editor编辑器 - 时间脱臼 - 博客园

ed=monaco.editor.create(document.getElementById("container"), {
value: "function hello() {\n\talert('Hello world!');\n}",
language: "javascript"
});
ed.getModel().onDidChangeContent((e)=>{
console.log(ed.getValue())
});
// Register a new language
monaco.languages.register({ id: 'mySpecialLanguage' });
// Register a tokens provider for the language
monaco.languages.setMonarchTokensProvider('mySpecialLanguage',{
//自定义配置
});
monaco.editor.create(document.getElementById("container"), {
value: '## 123123qwq',
language: 'mySpecialLanguage'
});