发布页面:
<template>
<view>
<view v-for="(item, index) in posts" :key="index" class="post-item">
<text class="post-content">{{ item.content }}</text>
</view>
</view>
<view>
<image src="/static/fabiao.png" mode="aspectFill" class="floating-btn" @tap="goToFabuPage"/>
</view>
</template>
<script>
export default {
data() {
return {
posts: []
}
},
async mounted() {
const result = await uniCloud.callFunction({
name: 'getConfessionList'
})
if (result.result.code === 0) {
this.posts = result.result.data
} else {
uni.showToast({
title: '获取数据失败'
});
}
},
methods: {
goToFabuPage() {
uni.navigateTo({
url: '/pages/cunkou/fabu/fabu'
});
}
}
}
</script>
<style>
.post-item {
padding: 15px;
border-bottom: 1px solid #ccc;
}
.post-content {
font-size: 16px;
color: #333;
}
.floating-btn {
position: fixed;
right: 20px;
top: 20px;
width: 20px;
height: 20px;
}
</style>
展示云函数列表页面
<template>
<view>
<input v-model="newPost" placeholder="请输入表白内容" />
<button @click="addPost">提交</button>
</view>
</template>
<script>
export default {
data() {
return {
newPost: ''
}
},
methods: {
async addPost() {
const result = await uniCloud.callFunction({
name: 'saveConfession',
data: {
content: this.newPost
}
})
if (result.result.code === 0) {
uni.showToast({
title: '提交成功'
});
this.newPost = '';
} else {
uni.showToast({
title: '提交失败'
});
}
}
}
}
</script>
云函数
'use strict';
exports.main = async (event, context) => {
const db = uniCloud.database()
try {
const res = await db.collection('confession').get()
return {
code: 200,
message: '获取数据成功',
data: res.data
}
} catch (error) {
return {
code: 500,
message: '获取数据失败',
error: error.message
}
}
};
'use strict';
exports.main = async (event, context) => {
const db = uniCloud.database()
try {
const {content} = event
const res = await db.collection('confession').add({content: content})
return {
code: 200,
message: '数据添加成功',
data: res
}
} catch (error) {
return {
code: 500,
message: '数据添加失败',
error: error.message
}
}
};