1.使用element ui中的 v-for 和 :key

<div v-for="post in posts" :key="post.value">
    <h6 class="blogTitle"><a href="#">{{post.blogtitle}}</a></h6>
    <p class="blogContent"><a href="#">{{post.blogcontent}}</a></p>
    <div class="blogFooter">
        <ul>
            <li class="blogViewingcount"><a href="#">浏览数:{{post.viewingcount}}</a></li>
            <li><a href="#">点攒:{{post.likes}}</a></li>
            <li><a href="#">发布于:{{post.releasetime}}</a></li>
            <li><a href="#">作者:{{post.authorid}}</a></li>
        </ul>
    </div>
</div>

2.下面是赋值

<script>
export default {
    name:'UserBlog',
    data(){
        return {
            posts:[]
        }
    },
    mounted(){
        //console.log("000");
        //请求博客内容
        this.$axios.post('/api/blog').then(res => {
          console.log(res)
            //将后端获取的数据赋值给posts集合
            this.$data.posts = res.data
        })
    }
}
</script>

Logo

前往低代码交流专区

更多推荐