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>
    17. <script>
    18. export default {
    19. data() {
    20. return {
    21. newslist:[]
    22. }
    23. },
    24. methods: {
    25. async getNews (){
    26. const res = await this.$myRequest({
    27. url:'/api/getnewslist'
    28. })
    29. this.newslist = res.data.message
    30. }
    31. },
    32. onLoad(){
    33. this.getNews()
    34. }
    35. }
    36. </script>
    37. <style lang='scss'>
    38. .news{
    39. .news_item{
    40. display: flex;
    41. padding:10rpx 20rpx;
    42. border-bottom:1px solid $shop-color;
    43. image{
    44. min-width:200rpx;
    45. max-width: 200rpx;
    46. height:75rpx;
    47. border:1px dashed #007AFF;
    48. }
    49. .right{
    50. margin-left:15rpx;
    51. display: flex;
    52. flex-direction: column;
    53. justify-content: space-between;
    54. .tit{
    55. font-size: 33rpx;
    56. }
    57. .info{
    58. font-size: 25rpx;
    59. text:nth-child(2){
    60. margin-left:30rpx;
    61. }
    62. }
    63. }
    64. }
    65. }
    66. </style>