1. <template>
    2.     <view class= 'news'>
    3.         <view class='news_item'>
    4.             <image src='http://demo.dtcms.net/upload/201504/20/thumb_201504200046589514.jpg'></image>
    5.             <view class='right'>
    6.                 <view class='tit'>
    7.                     woshi yieg biaoti 
    8.                 </view>
    9.                 <view class='info'>
    10.                     <text>发表时间：2020-09-16</text>
    11.                     <text>浏览:</text>
    12.                 </view>
    13.             </view>
    14.         </view>
    15.     </view>
    16. </template>
    18. <script>
    19.     export default {
    20.         data() {
    21.             return {
    22.                 newslist:[]
    23.             }
    24.         },
    25.         methods: {
    26.             async getNews (){
    27.                 const res = await this.$myRequest({
    28.                     url:'/api/getnewslist'
    29.                 })
    30.                 this.newslist = res.data.message
    31.             }
    32.         },
    33.         onLoad(){
    34.             this.getNews()
    35.         }
    36.     }
    37. </script>
    39. <style lang='scss'>
    40. .news{
    41.     .news_item{
    42.         display: flex;
    43.         padding:10rpx 20rpx;
    44.         border-bottom:1px solid $shop-color;
    45.         image{
    46.             min-width:200rpx;
    47.             max-width: 200rpx;
    48.             height:75rpx;
    49.             border:1px dashed #007AFF;    
    50.         }
    51.         .right{
    52.             margin-left:15rpx;
    53.             display: flex;
    54.             flex-direction: column;
    55.             justify-content: space-between;
    56.             .tit{
    57.                 font-size: 33rpx;
    58.             }
    59.             .info{
    60.                 font-size: 25rpx;
    61.                 text:nth-child(2){
    62.                     margin-left:30rpx;
    63.                 }
    64.             }
    65.         }
    66.     }
    67. }
    68. </style>