我发请求回来的数据要以不同的样式展示该怎么做？划红框的分别是两条数据我试了好几种方法都不行，请大神给指点指点

emmmm 靠左靠右两个样式，循环的时候 i % 2 === 0 根据奇偶使用不同 class 不就好了

这个很基础的，拼接字符串，在循环的时候根据索引渲染不同的字符串进行展示就行。 <li v-for="(v,k) in lists" :key="k" :class="addDifClass(k)"> <a v-if="k==1"></a> <b v-if="k==2"></b> </li> 这样很清晰了吧，里面的内容可以换，也不一定是非要1，2这种写死的，内容都可以换

怎么循环数据以不同样式展示？

根据需求，可以根据数据的奇偶性添加不同的类，也可根据数据的属性添加多种不同的类

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://cdn.bootcss.com/vue/2.5.13/vue.js"></script>
    <title>Document</title>
    <style>
       li.odd{
           background-color: #aaa;
       }
       li.even{
           background-color: coral;
       }
    </style>
</head>

<body>
    <div id="app">
        <ul>
            <li v-for="(v,k) in lists" :key="k" :class="addDifClass(k)">
                <div>{{v.time}}</div>
                <h2>{{v.title}}</h2>
                <div>{{v.content}}</div>
            </li>
        </ul>
    </div>
    <script async>
        var app = new Vue({
            el: '#app',
            data: {
                message: 'Hello Vue!',
                lists:[],
            },
            methods: {
                //这里我把数据的索引传过来，根据索引添加不同的类，
                //在实际中可以根据需求 把值v 传过来，根据v的值添加不同的样式class
                addDifClass(k){
                     if(k%2==0){
                         return {even:true}
                     }else{
                         return {odd:true}
                     }
                }
            },
            created() {
                // 模拟返回数据
                const mockdata = [
                    { time: '2018-5', title: 'title', content: 'content111' },
                    { time: '2018-6', title: 'title2', content: 'content111' },
                    { time: '2018-6', title: 'title2', content: 'content111' },
                    { time: '2018-6', title: 'title2', content: 'content111' },
                    { time: '2018-6', title: 'title2', content: 'content111' },
                ]
                this.lists=mockdata;
            }
        })
    </script>
</body>

</html>

希望能帮到你，如果有帮助希望采纳

怎么循环数据以不同样式展示？

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

CSS如何让指定的某个Tag不显示（比如：display=none），但是还是占有位置呢？

Next.js做纯前端是否可行？

如何在Vue中点击菜单弹出v-dialog对话框？

如何用Vue实现Word文档自动分页与双页排版功能？

如何实现一个深拷贝函数？

为什么 el-tabl操作列加了 fixed="right"之后列边框线不完整，有大佬知道原因吗？

怎么循环数据以不同样式展示？

你尚未登录，登录后可以

js 如何将Key属性相同的放在同一个数组？

CSS如何让指定的某个Tag不显示（比如：display=none），但是还是占有位置呢？

Next.js做纯前端是否可行？

如何在Vue中点击菜单弹出v-dialog对话框？

如何用Vue实现Word文档自动分页与双页排版功能？

如何实现一个深拷贝函数？

为什么 el-tabl操作列加了 fixed="right"之后 列边框线不完整，有大佬知道原因吗？

为什么 el-tabl操作列加了 fixed="right"之后列边框线不完整，有大佬知道原因吗？