zhilian笔记

vuetify https://vuetifyjs.com/zh-Hans/

可参考链接：https://blog.csdn.net/u013089490/article/details/84025743

---

一、pages/admin/eatUp-----points.vue

1.@submit.prevent 阻止默认事件提交

2.<v-toolbar> 工具栏

​ flat 删除工具栏的框阴影 color=“white”, class=“elevation-2”

​ <v-toolbar-title>

3.<v-divider> 分割线

​ class=“mx-2”

​ vertical 垂直分割线

4.<v-spacer> 空白

​ v-spacer` 组件在你想要填充可用空间或在两个组件之间留出空间时非常有用。

5.div class=“pt-3 mr-2”,style=“width: 5rem”

6.<v-text-field> 文本框

​ v-model,label(类似value)

7.<v-btn> color=“primary” 深蓝色按钮

​ icon 指定按钮为图标按钮. 按钮将变成圆形按钮并使用text prop.

​ ripple v-ripple 指令用于显示用户的动作

8.<v-data-table> 数据表格

​ headers 一个对象数组，每个对象描述一个表头列

​ items 要显示的数据数组

​ loading 如果为 true 且未提供任何项目，则将显示加载文本

​ total-items==server-items-length 使用这个属性会禁用内置的排序和分页

​ :pagination.sync=“pagination” 进行分页

9.<v-dialog> 对话框

​ scrollable 可滚动，当设置为 true 时，期望有一个 v-card 和一个 v-card-text 组件，并有指定的高度

​ fullscreen 改变全屏显示的布局

10.<v-card> 卡片

11. <v-icon> 图标

12. <v-card-text> 主要用于卡片中的文本内容。 对文本应用填充，将其字体大小减少为875RAM

13. pagination.sync属性说明

    

---

二、pages/admin/eatUp -------ranking.vue

1.<v-btn-toggle> 按钮组

2.<v-text-field > 文本框

​ prefix,suffix

3.<v-btn>

​ dark 将暗色主题变量应用到组件

---

三、pages/admin/eatUp ------------gifts.vue

1.<v-form> 表单

​ < lazy-validation> 如果启用，value将永远是 true ，除非有可见的验证错误。您仍然可以调用validate()来手动触发验证。

2.<v-container> v-container 提供了将你的网站内容居中和水平填充的功能

​ grid-list-md

3.<v-layout> wrap超出换行 <v-flex> flex布局

4.<v-text-field > 文本框

​ clearable 添加清除已输入内容功能，默认图标是Material Design Icons mdi-clear

​ :rules="[v => (!!v && !!v.trim()) || ‘不能为空’]"

5.<v-textarea> 多行文本框

6.<v-card-actions> 用于为卡片放置 动作 的容器，如 v-btn 或 v-menu。 同时在按钮上使用 个特殊边距 ，以便它们与其他卡片内容区域的匹配。

7._.clone lodash的浅拷贝

---

四、pages/admin/system ------------permission.vue

1.<no-ssr> 组件 Nuxt.js中 该组件用于设置组件不在服务器渲染中呈现

2.<table> class=“v-datatable v-table theme–light”

3.<v-chip> 组件用于传送小信息。 使用close属性，纸片将变为交互式，允许用户进行交互

4.JSON.parse(JSON.stringify 深拷贝

5.transition cubic-bezier(贝塞尔曲线)

6.v-toolbar-title用于显示标题并且 v-toolbar-items 允许 v-btn 扩展全高度。

7.<v-progress-linear> 进度条 用于直观地将数据展示给用户。 它们也可以表示一个不确定的数量，代表加载或处理中状态。

​ indeterminate，不定线条，保持动画状态

---

.Moment
JavaScript 日期处理类库
http://momentjs.cn/

import * as moment from ‘moment’

moment(time).format(‘YYYY-MM-DD HH:mm’)

---

Lodash
Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。
https://www.lodashjs.com/

import * as _ from ‘lodash’

1.const search = .clone(this.searchData) 浅拷贝_

_2 .find(collection,[predicate=.identity],fromInsex=0])

遍历 collection（集合）元素，返回 predicate（断言函数）第一个返回真值的第一个元素。predicate（断言函数）调用3个参数： (value, index|key, collection)

​ if (!_.find(req.session[SESSION_PERMISSION], p => pks.indexOf§ !== -1))

---

import * as $ from ‘jquery’

$(’#imageFile’).trigger(‘click’)

trigger() 方法触发被选元素的指定事件类型

---

Nuxt项目文件目录结构解释(VUE.js 框架)
-------------------------------------------------------------------------------------------------
|-- .nuxt // Nuxt自动生成，临时的用于编辑的文件，build
|-- assets // 用于组织未编译的静态资源入LESS、SASS 或 JavaScript
|-- components // 用于自己编写的Vue组件，比如滚动组件，日历组件，分页组件
|-- layouts // 布局目录，用于组织应用的布局组件，不可更改。
|-- middleware // 用于存放中间件
|-- pages // 用于存放写的页面，我们主要的工作区域
|-- plugins // 用于存放JavaScript插件的地方
|-- static // 用于存放静态资源文件，比如图片
|-- store // 用于组织应用的Vuex 状态管理。
|-- .editorconfig // 开发工具格式配置
|-- .eslintrc.js // ESLint的配置文件，用于检查代码格式
|-- .gitignore // 配置git不上传的文件
|-- nuxt.config.json // 用于组织Nuxt.js应用的个性化配置，已覆盖默认配置
|-- package-lock.json // npm自动生成，用于帮助package的统一性设置的，yarn也有相同的操作
|-- package-lock.json // npm自动生成，用于帮助package的统一性设置的，yarn也有相同的操作
|-- package.json // npm包管理配置文件
---------------------------------------------------------------------------------------------------

1.axios
http库
http://www.axios-js.com/
2.Moment
JavaScript 日期处理类库
http://momentjs.cn/
3.nuxt
NuxtJS 让你构建你的下一个 Vue.js 应用程序变得更有信心。这是一个 开源 的框架，让 web 开发变得简单而强大。
https://www.nuxtjs.cn/
4.Vuetify
Vuetify 是一个纯手工精心打造的 Material 样式的 Vue UI 组件库。 不需要任何设计技能 — 创建叹为观止的应用程序所需的一切都触手可及。
https://vuetifyjs.com/zh-Hans/
5.vue
渐进式JavaScript 框架
https://cn.vuejs.org/

6.cross-env
是运行跨平台设置和使用环境变量的脚本
这个迷你的包(cross-env)能够提供一个设置环境变量的scripts，让你能够以unix方式设置环境变量，然后在windows上也能兼容运行。

7.PM2
PM2 是一个应用管理器，它自身具备负载均衡能力，它可以让应用在后台一直运行，也可以让无缝重启应用，中间不会停止服务，
可以开机启动，对开发者来讲可以极大地方便应用部署，降低维护成本。
https://pm2.keymetrics.io/

8.excel4node
功能齐全的xlsx文件生成库，允许创建高级Excel文件。

9.wechat-enterprise
微信公共平台企业号版SDK

10.Lodash
Lodash 是一个一致性、模块化、高性能的 JavaScript 实用工具库。
https://www.lodashjs.com/

11.puppeteerjs
Puppeteer 是一个 Node 库，它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome
http://www.puppeteerjs.com/

\12. Jira
jira是目前比较流行的基于Java架构的管理系统（Atlassian公司支持），有开源代码，方便做二次开发（可扩展性）。

13.Express.js
https://www.expressjs.com.cn/
基于 Node.js 平台，快速、开放、极简的 Web 开发框架

# Sequelize
https://www.sequelize.com.cn/
https://www.cnblogs.com/zzsdream/p/11065626.html

Sequelize 是一个基于 promise 的 Node.js ORM, 目前支持 Postgres, MySQL, MariaDB, SQLite 以及 Microsoft SQL Server.
它具有强大的事务支持, 关联关系, 预读和延迟加载,读取复制等功能。