项目-果果记账

用了哪些知识 后续计划 现在的记账有一个bug是，更新标签名时，EditLabel.vue的update会执行两次，所以会提示标签名重复，但是又可以存储。当真的和别的标签重复时，又不会存储，符合预期。

deep语法 因为之前在记账页已经有一个type组建了，统计页想直接拿过来用。但是我们想要使用scoped将范围缩小在本组建内，那么css怎么深入到我们想拿过来用的type组件里的li呢？？ vue给

Vuex 是什么？ Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vu

在做完标签页后发现了一个bug，即Label.vue和Money.vue的数据不会同步更新，需要手动刷新才行（如，在标签页新建一个标签，点击记账页发现标签没有自动更新）。这是因为他们俩的数据“各自为政

custom.d.ts 在src目录下新建custom.d.ts（只要以.d.ts结尾即可），在其中存放全局类型。此时整个src目录都可以在不引用的前提下使用该类型。 labels.vue

Moeny.vue读取各组件数据 .sync 修饰符 在有些情况下，我们可能需要对一个 prop 进行“双向绑定”。不幸的是，真正的双向绑定会带来维护上的问题，因为子组件可以变更父组件，且在父组件和子

css与React版本除颜色分配外几乎一致，需要的话请参见之前的文章React果果记账-styled-components，整体框图如下，css具体代码此处不赘述。 Types.vue 用装饰器的好处

初步导航栏 在App.vue中使用 <router-view/> 进行页面渲染，使用 <router-link> 进行页面切换 <router-view> <router-view> 组件是一个 fu

创建项目 打开命令行 yarn global add @vue/cli@4.1.2 vue create vue-1 手动设置（回车确定，空格选择） cd vue-1 webstorm中打开文件夹 在

该记账项目时基于React/React Router/自定义Hooks/weppack实现的极简主义应用，特点是一键急速记账。 该项目使我对TypeScript、webpack和Hooks API 有

解决标签过多时记账键盘被挤出页面的情况 部署到GitHub 部署的最大问题就是路径错误，需要更改路径 这里会生成一个链接，点进去确定功能是否完好 建议直接在GitHub中单独建立仓库存放build G

统计页面的顶部分类为“收入/支出”，和记账页的category很相似，所以可以直接使用。 统计页主要展示：标签，金额，（时间），为了把时间转化为年月日的格式，需要引入 基础代码为： 收入/支出分类 将

更优雅的更新与删除 更新 不优雅版 优雅版 删除 不优雅版 优雅版 增加编辑页面回退功能 为了使icon可以点击，需要修改Icon组件，即自定义Icon需要继承SVG所有属性 问题在于，当使用 ...

封装Input 因为记账系统中很多地方都需要用到input，秉着“我与重复不共戴天”的原则，我们进行Input封装 因为所有属性都是继承props的，那么 input 可以写成 这样就可以把所有属性一

抽离useTags函数 tagList样式 改变tag的类型 在之前的程序中，我们的tag类型为string，存放标签名。但是当用户想要更改标签名时，该标签所对应的数据也得做出改变，这很不方便。 将t

TagsSection NoteSection 受控组件写法 非受控组件写法 React和HTML的onChange区别 React的onChange会在输入字符的时候触发 HTML的onChange

ReactRouter之activeClassName 现阶段点击不同的links时页面切换的不明显，可以使用 activeClassName 使点击标签高亮 步骤：Google--React Rou

一.下载icons 进入阿里巴巴矢量图标库选择喜欢的icon下载。 二.自定义webpack配置 yarn eject & svg-sprite-loader & Tree Shaking 安装 在c

前期准备 一.create-react-app 新建文件夹，拖动到Webstorm中，打开控制台 为了防止每次都自动打开浏览器，需要在项目中新建一个文件 .env ,在该文件中写入BROWSER=no

本地仓库 git 六行配置 远程仓库 创建ssh key 进入.ssh目录，得到公钥内容 进入github-settings-SSH and GPB keys-new SSH key，粘贴公钥内容并a