国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

親手?jǐn)]一個(gè)node項(xiàng)目

crossoverJie / 1623人閱讀

摘要：實(shí)現(xiàn)一個(gè)增刪查的項(xiàng)目項(xiàng)目截圖錄入頁(yè)詳情頁(yè)列表頁(yè)項(xiàng)目目錄如下存放靜態(tài)資源文件存放視圖文件用于存放各個(gè)頁(yè)面存放路由文件不過(guò)我最終為了方便都寫(xiě)到了下也可以說(shuō)是偷了個(gè)懶存放模型文件并對(duì)外暴露接口后面用于的存儲(chǔ)這個(gè)就有點(diǎn)像功能差不多都是存儲(chǔ)數(shù)據(jù)嘛大家

node + express + es6 + mongoose + mongodb 實(shí)現(xiàn)一個(gè)增刪查的項(xiàng)目

項(xiàng)目截圖：
1.錄入頁(yè):

2.詳情頁(yè)：

3.列表頁(yè)：

項(xiàng)目目錄如下：

├─ app.js
├─ bin
│    └─ www
├─ index.html
├─ js
│    └─ jquery.js
├─ models
│    └─ movies.js
├─ package.json
├─ public
│    ├─ javascripts
│    │    └─ jquery.min.js
│    └─ stylesheets
│           ├─ bootstrap
│           └─ style.css
├─ routes
│    ├─ admin.js
│    ├─ detail.js
│    ├─ index.js
│    ├─ list.js
│    └─ users.js
├─ schemas
│    └─ movies.js
└─ views
       ├─ admin.ejs
       ├─ delete.ejs
       ├─ detail.ejs
       ├─ error.ejs
       ├─ includes
       │    └─ header.ejs
       ├─ index.ejs
       └─ list.ejs

public： 存放靜態(tài)資源文件
views： 存放視圖文件（ejs） 用于存放各個(gè)頁(yè)面
routes： 存放路由文件 不過(guò)我最終為了方便 都寫(xiě)到了app.js下 也可以說(shuō)是偷了個(gè)懶
schemas models： 存放mongoose模型文件 并對(duì)外暴露接口 后面用于mongodb的存儲(chǔ) 這個(gè)就有點(diǎn)像vuex 功能差不多 都是存儲(chǔ)數(shù)據(jù)嘛 大家可以自行百度 以后我也會(huì)出點(diǎn)mongodb的基礎(chǔ)教程

基本代碼：

錄入頁(yè)

點(diǎn)擊錄入后執(zhí)行這里

post請(qǐng)求相當(dāng)于拿到了form表單的內(nèi)容
然后跳轉(zhuǎn)到詳情頁(yè)

req.query.id是請(qǐng)求體中的id字段

save這個(gè)方法是mongoose的方法 用于存儲(chǔ)到mongodb中

列表頁(yè)

/admin/list進(jìn)入列表頁(yè)

fetch為我在建模里面寫(xiě)的靜態(tài)方法

在列表頁(yè)中點(diǎn)擊刪除按鈕 要做到刪除效果
我這里用的是jq

對(duì)應(yīng)的后端代碼為

相當(dāng)于點(diǎn)擊了按鈕 請(qǐng)求了admin/list這個(gè)接口 把對(duì)應(yīng)的_id這條數(shù)據(jù)在mongodb中刪除如果返回碼為1說(shuō)明請(qǐng)求成功 同時(shí)remove()dom節(jié)點(diǎn)
當(dāng)沒(méi)有條數(shù)的時(shí)候 就意味著沒(méi)數(shù)據(jù)了 需要從新添加 就要跳轉(zhuǎn)錄入頁(yè)了 這里用的是window.open()這個(gè)方法實(shí)現(xiàn)

基本功能就是這些 這個(gè)項(xiàng)目難點(diǎn)在于express框架路由 視圖 和mongoose的結(jié)合 有些童鞋多帶帶寫(xiě)一些路由沒(méi)問(wèn)題 但是以結(jié)合起來(lái) 問(wèn)題就來(lái)了 經(jīng)常總結(jié)會(huì)有很好的效果 源碼后續(xù)我會(huì)傳到github上 有問(wèn)題歡迎交流

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/18990.html

相關(guān)文章

  • 親手擼一個(gè)node項(xiàng)目

    摘要：實(shí)現(xiàn)一個(gè)增刪查的項(xiàng)目項(xiàng)目截圖錄入頁(yè)詳情頁(yè)列表頁(yè)項(xiàng)目目錄如下存放靜態(tài)資源文件存放視圖文件用于存放各個(gè)頁(yè)面存放路由文件不過(guò)我最終為了方便都寫(xiě)到了下也可以說(shuō)是偷了個(gè)懶存放模型文件并對(duì)外暴露接口后面用于的存儲(chǔ)這個(gè)就有點(diǎn)像功能差不多都是存儲(chǔ)數(shù)據(jù)嘛大家 node + express + es6 + mongoose + mongodb 實(shí)現(xiàn)一個(gè)增刪查的項(xiàng)目 項(xiàng)目截圖： 1.錄入頁(yè): showI...

    oujie 評(píng)論0 收藏0

  • 親手擼一個(gè)React（一）：JSX與虛擬DOM

    摘要：前言的火熱程度已經(jīng)達(dá)到了個(gè)，本系列文章主要用簡(jiǎn)單的代碼來(lái)實(shí)現(xiàn)一個(gè)，來(lái)了解虛擬算法以及和的設(shè)計(jì)。要想將虛擬轉(zhuǎn)成真實(shí)并渲染到頁(yè)面上，就需要調(diào)用，比如這段代碼轉(zhuǎn)換后的樣子這時(shí)，會(huì)將掛載到為的下，從而在頁(yè)面上顯示出來(lái)。 前言 react的火熱程度已經(jīng)達(dá)到了94.5k個(gè)start，本系列文章主要用簡(jiǎn)單的代碼來(lái)實(shí)現(xiàn)一個(gè)react，來(lái)了解JSX、虛擬DOM、diff算法以及state和setStat...

    aaron 評(píng)論0 收藏0

  • 手摸手，帶你用vue擼后臺(tái) 系列一(基礎(chǔ)篇)

    摘要：詳細(xì)具體的使用可以見(jiàn)文章手摸手，帶你優(yōu)雅的使用。為了加速線上鏡像構(gòu)建的速度，我們利用源進(jìn)行加速并且將一些常見(jiàn)的依賴打入了基礎(chǔ)鏡像，避免每次都需要重新下載。 完整項(xiàng)目地址：vue-element-admin系類文章二：手摸手，帶你用vue擼后臺(tái) 系列二（登錄權(quán)限篇）系類文章三：手摸手，帶你用vue擼后臺(tái) 系列三(實(shí)戰(zhàn)篇）系類文章四：手摸手，帶你用vue擼后臺(tái) 系列四(vueAdmin 一...

    xiaotianyi 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<