学习【全栈之巅】Node.js + Vue.js 全栈开发王者荣耀手机端官网和管理后台学习笔记（2.15-2.16）

本文链接：https://blog.csdn.net/weixin_43941712/article/details/115374470

本项目是学习Bilibili 全栈之巅视频教程相关源码和体会
https://gitee.com/blaunicorn/node-vue-wangzherongyao
持续更新中…

2.15 广告位轮播图

// admin\src\views\Main.vue
          <el-menu-item-group>
            <template slot="title">广告位</template>
            <el-menu-item index="/ad/create">新建广告位</el-menu-item>
            <el-menu-item index="/ad/list">广告位列表</el-menu-item>
          </el-menu-item-group>

// admin\src\router\index.js
            {
                path: '/ad/create',
                name: 'AdCreate',
                component: () => import('../views/AdEdit.vue')
            },
            {
                path: '/ad/edit/:id',
                name: 'AdEdit',
                component: () => import('../views/AdEdit.vue'),
                props: true // 允许参数注入
            },
            {
                path: '/ad/list',
                name: 'AdList',
                component: () => import('../views/AdList.vue')
            }

admin端src/views新建 AdEdit.vue AdList.vue

server端model下新建Ad.js

const mongoose = require('mongoose')

// 定义模型字段 一个广告位内要有多个广告
const schema = new mongoose.Schema({
    name: { type: String },
    items: [{
        image: { type: String },
        url: { type: String },
        title: { type: String },

    }],
})

// 导出Item模型，哪里需要用，哪里引入，引入到 routes/admin/index.js
module.exports = mongoose.model('Ad', schema)

2.16 管理员账号设置

// 服务端设置模型  server/models/AdminUser.js
const mongoose = require('mongoose')

const schema = new mongoose.Schema({
    username: { type: String },
    password: { type: String }
})

module.exports = mongoose.model('AdminUser', schema)

管理端main.vue页面设置联接
router/index.js设置路由
服务端安装插件，并建立模型，密码加盐

// npm i bcrypt  // 因gyp错误未安装成功，改成
npm install bcryptjs

// server\models\AdminUser.js
// let bcrypt= require('bcryptjs')  可以定义变量引用，也可以直接引用
const mongoose = require('mongoose')

const schema = new mongoose.Schema({
    username: { type: String },
    password: {
        type: String,
        required: true,
        select: false,//防止查询出密码，此时前端查询返回的密码值为空
        set(val) {
            // 散列同步方法,第二个参数为加密指数
            return require('bcryptjs').hashSync(val, 12)
        }
    }
})

module.exports = mongoose.model('AdminUser', schema)