# egoShop

**Repository Path**: amifan/egoShop

## Basic Information

- **Project Name**: egoShop
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2020-04-26
- **Last Updated**: 2021-05-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

1. element
    1. 设计原则
        一致性 Consistency
        反馈 Feedback
        效率 Efficiency
        可控 Controllability
    2. 安装
        npm i element-ui -S
    3. 引入
        1. 完整引入
            import ElementUI from 'element-ui';
            import 'element-ui/lib/theme-chalk/index.css';
            Vue.use(ElementUI);
        2. 按需引入
            1. 安装 babel-plugin-component
            2. 修改配置.babelrc
                "plugins": [
                    [
                    "component",
                    {
                        "libraryName": "element-ui",
                        "styleLibraryName": "theme-chalk"
                    }
                    ]
                ]
            3. 使用
                import { Button, Select } from 'element-ui';
                使用1：<Button></Button>
                使用2：Vue.component(Button.name, Button);


2. git
    1. Git是目前世界上最先进的分布式版本控制系统
    2. 安装:全部下一步
        最后配置 用户名和邮箱
    3. 初始化成本地git仓库
        1. 创建一个文件夹
        2. git init
    4. 连接远程仓库
        (github,码云)
        1. 注册码云
        2. 生成SSH公钥
            ssh-keygen -o
        3. 添加公钥到码云
            设置->安全设置->SHH公钥
        4. 关联远程仓库
            git remote add origin 你的仓库地址
        5. 推送内容到远程仓库
            git add README.md  / .
            git commit -m '添加README文件'
            git push
        
        6. 克隆命令
            git clone https://gitee.com/amifan/testgit.git  : 把远程仓库下载到本地，一个项目一般只需要使用一次
        
        7. git分区
            本地：自己的电脑上的文件
            暂存区：git add . 中间缓存区域
            git本地仓库:git commit -m 'xxx' 把暂存区中的文件添加到本地仓库
            远程仓库：git push :把本地仓库中的数据推送到远程仓库
            再次想同步远程仓库数据：git pull


3. 项目
    1. 接口
        使用本地接口
        1. 导入数据库
            创建数据库：ego
            点击ego数据库，选择“导入”,选择ego.sql文件,最后选择"执行"
        2. 把mock文件夹放在项目文件夹中
        3. 需要运行后台(express),已经解决了跨域问题
            http://localhost:3000/
    2. 路由
        1. 4个路由
            登录页面不需要导航条，其他页面需要导航条
        2. 路由全部静态路由
    3. 导航条
    4. 登录页面
    5. 登录逻辑

第二天：
    1. JSON Web Token
        1. JSON Web Token（缩写 JWT）是目前最流行的跨域认证解决方案
        2. 认识：由3段字符串组成一个大的字符串，这个字符串中保存着关键性数据，还有过期时间。
        3. api
            1. jwt.sign(payload, secretOrPrivateKey, [options, callback]) : 生成token
            2. jwt.verify（token，secretOrPublicKey，[options，callback]） : 验证token的合法性
            3. jwt.decode（token [，options]）:返回解码没有验证签名是否有效的payload
        4. 一般token是放在请求的头部,使用Authorization关键字带token
    2. 查询商品
        1. 找接口
        2. 使用Table组件
        3. 懒加载自定义叶子节点


第三天
    1. 富文本编辑器
        https://github.com/HaoChuan9421/vue-ueditor-wrap
        1. 下载安装：npm i -S vue-ueditor-wrap
        2. 下载ueditor
        3. 把文件名修改为UEditor，放到public文件夹下
        4. 引入VueUeditorWrap组件
            import VueUeditorWrap from 'vue-ueditor-wrap'
        5. 局部注册或全局注册
            components: {
                VueUeditorWrap
            }
            // 或者在 main.js 里将它注册为全局组件
            Vue.component('vue-ueditor-wrap', VueUeditorWrap)
        6. 使用
            <vue-ueditor-wrap v-model="msg" :config='myConfig'></vue-ueditor-wrap>
        7. 配置
            myConfig: {
                // 编辑器不自动被内容撑高
                autoHeightEnabled: false,
                // 初始容器高度
                initialFrameHeight: 240,
                // 初始容器宽度
                initialFrameWidth: '100%',
                
                UEDITOR_HOME_URL: '/UEditor/'
            }
    2. 删除功能
        调用$confirm方法即可打开消息提示
    3. 编辑功能
        1. 点击编辑按钮，获取数据，弹出的窗口中要显示要编辑的数据
    4. 规格参数页面
        1. 列表数据
          

第四天
    规格参数的使用
    1. 在"查询商品页面"，添加商品或修改商品时，需要展示出对应类目的规格参数
        需要增加一个后台接口：根据类目id查询规格参数
    2. 需要把添加商品时的规格参数保存起来，修改商品时也能修改规格参数值
        需要增加三个后台接口和一个数据表
        数据表设计：
            1. 需要知道是哪个产品的规格参数：需要知道产品id
            2. 设计一个主键
            3. 存储数据字段
        添加规格参数内容接口：

        预修改规格参数内容接口：

        修改规格参数内容接口：

    3. 修改后台添加产品的接口
        让返回的成功结果中有商品id
    
    4. 使用：
        1. 添加产品时：
            选中类目时，就获取当前类目的规格参数，如果有就显示出来


第五天
    1. tree自定义节点内容
    2. 内容区域
    3. 在vue中强制刷新：把组件删除，再重新添加进来
    4. $nextTick()方法：