Express Vue JS和Multer {{post.description}} 从“@/service/PostService”导入PostService 导出默认值{ 数据(){ 返回{ 员额:[] } }, 挂载(){ 这是getPosts() }, 方法:{ 异步getPosts(){ const response=wait PostService.fetchPosts() this.posts=response.data.posts } } } const multer=require('multer'); const Post=require(“./models/Post”) const storage=multer.diskStorage({ 目的地:(请求、文件、cb)=>{ cb(空“./上传/”); }, 文件名:(请求、文件、cb)=>{ cb(null,Date.now()+file.originalname); } }) 常量文件过滤器=(请求、文件、cb)=>{ 如果(file.mimetype==='image/jpeg'| | file.mimetype==='image/png'){ cb(null,true); }否则{ cb(空,假); } } const upload=multer({ 存储:存储, 文件过滤器, 限制:{ 文件大小:1024*1024*5 } }); app.get('/posts',(req,res)=>{ find({},'postmagedescription',(错误,posts)=>{ 如果(错误){ console.log(错误) } res.send({ 帖子 }) }).sort({u id:-1})
})Express Vue JS和Multer {{post.description}} 从“@/service/PostService”导入PostService 导出默认值{ 数据(){ 返回{ 员额:[] } }, 挂载(){ 这是getPosts() }, 方法:{ 异步getPosts(){ const response=wait PostService.fetchPosts() this.posts=response.data.posts } } } const multer=require('multer'); const Post=require(“./models/Post”) const storage=multer.diskStorage({ 目的地:(请求、文件、cb)=>{ cb(空“./上传/”); }, 文件名:(请求、文件、cb)=>{ cb(null,Date.now()+file.originalname); } }) 常量文件过滤器=(请求、文件、cb)=>{ 如果(file.mimetype==='image/jpeg'| | file.mimetype==='image/png'){ cb(null,true); }否则{ cb(空,假); } } const upload=multer({ 存储:存储, 文件过滤器, 限制:{ 文件大小:1024*1024*5 } }); app.get('/posts',(req,res)=>{ find({},'postmagedescription',(错误,posts)=>{ 如果(错误){ console.log(错误) } res.send({ 帖子 }) }).sort({u id:-1}),express,vue.js,multer,Express,Vue.js,Multer,}) 大家好,我正要用multer在我的前端显示图像。但它只显示imagelink或图像目的地,但我已经在后端添加了一些图像。因此,如何使用vue动态地向前端显示图像。我对数据库中的每个数据都使用了v-for。我应该向我的v-card-media输入什么来动态获取图像。“那么我如何将图像显示到我的前端”->我已经这样做了。但我想动态地得到它。我用v-forWhere?在codeYeap中看不到任何元素。我已经试过很多次了。这就是为什么我问如何动态地做它。因为我不知道。对不起,请看你在问题中的帖子
大家好,我正要用multer在我的前端显示图像。但它只显示imagelink或图像目的地,但我已经在后端添加了一些图像。因此,如何使用vue动态地向前端显示图像。我对数据库中的每个数据都使用了v-for。我应该向我的v-card-media输入什么来动态获取图像。“那么我如何将图像显示到我的前端”->我已经这样做了。但我想动态地得到它。我用v-forWhere?在codeYeap中看不到任何
元素。我已经试过很多次了。这就是为什么我问如何动态地做它。因为我不知道。对不起,请看你在问题中的帖子。谁能用你展示的信息帮助你解决这个问题?
<template>
<v-app id="inspire" dark >
<v-layout v-for = "post in posts" :key = "post.id">
<v-flex xs3>
<v-card >
<v-card-media>
<img
:src = "post.postImage">
</v-card-media>
<v-card-title>
{{post.description}}
</v-card-title>
</v-card>
</v-flex>
</v-layout>
</v-app>
</template>
<script>
import PostService from '@/service/PostService'
export default {
data(){
return {
posts: []
}
},
mounted (){
this.getPosts()
},
methods: {
async getPosts() {
const response = await PostService.fetchPosts()
this.posts = response.data.posts
}
}
}
</script>
const multer = require('multer');
const Post = require('./models/post')
const storage = multer.diskStorage({
destination: (req, file, cb) => {
cb(null, './uploads/');
},
filename: (req, file, cb ) => {
cb(null, Date.now() + file.originalname);
}
})
const fileFilter = (req, file, cb) => {
if(file.mimetype === 'image/jpeg' || file.mimetype === 'image/png') {
cb(null, true);
}else {
cb(null, false);
}
}
const upload = multer({
storage: storage,
fileFilter,
limits: {
fileSize: 1024 * 1024 * 5
}
});
app.get('/posts', (req, res) => {
Post.find({},'postImage description', (error, posts) => {
if(error) {
console.log(error)
}
res.send({
posts
})
}).sort({_id: -1})