微信小程序记事本代码
时间: 2024-05-06 11:13:30 浏览: 170
微信小程序记事本代码可以分为前端和后端两部分。前端部分主要负责用户界面的展示和交互,后端部分则处理数据的存储和读取。
前端代码示例:
```javascript
// pages/index/index.js
Page({
data: {
notes: [], // 存储笔记列表
inputText: '', // 输入框内容
},
onLoad() {
// 页面加载时从后端获取笔记列表
this.getNotes();
},
getNotes() {
// 调用后端接口获取笔记列表
wx.request({
url: '后端接口地址',
success: (res) => {
this.setData({
notes: res.data,
});
},
});
},
addNote() {
// 添加笔记
const newNote = {
content: this.data.inputText,
time: new Date().getTime(),
};
wx.request({
url: '后端接口地址',
method: 'POST',
data: newNote,
success: () => {
this.setData({
inputText: '',
});
this.getNotes();
},
});
},
deleteNote(e) {
// 删除笔记
const noteId = e.currentTarget.dataset.id;
wx.request({
url: `后端接口地址/${noteId}`,
method: 'DELETE',
success: () => {
this.getNotes();
},
});
},
});
```
后端代码示例:
```javascript
// app.js
const express = require('express');
const app = express();
const bodyParser = require('body-parser');
const fs = require('fs');
app.use(bodyParser.json());
// 获取笔记列表
app.get('/notes', (req, res) => {
const notes = JSON.parse(fs.readFileSync('notes.json', 'utf8'));
res.json(notes);
});
// 添加笔记
app.post('/notes', (req, res) => {
const notes = JSON.parse(fs.readFileSync('notes.json', 'utf8'));
const newNote = req.body;
notes.push(newNote);
fs.writeFileSync('notes.json', JSON.stringify(notes));
res.sendStatus(200);
});
// 删除笔记
app.delete('/notes/:id', (req, res) => {
const notes = JSON.parse(fs.readFileSync('notes.json', 'utf8'));
const noteId = req.params.id;
const updatedNotes = notes.filter((note) => note.time !== parseInt(noteId));
fs.writeFileSync('notes.json', JSON.stringify(updatedNotes));
res.sendStatus(200);
});
app.listen(3000, () => {
console.log('Server is running on port 3000');
});
```
以上代码仅为示例,实际开发中还需要根据具体需求进行适当的修改和完善。
阅读全文