read.vue 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <template>
  2. <div class="flex flex-col full-width mb-20">
  3. <div class="full-width text-left bold font-16">今日学习</div>
  4. <div class="flex flex-center">
  5. <div class="flex flex-center ml-10" style="flex: 5">
  6. <div
  7. class="flex flex-col flex-center border radius box-shadow mr-15 mt-15"
  8. v-for="item in data"
  9. >
  10. <div>
  11. <img :src="item.thumb_url" style="width: 50px; height: 120px" />
  12. </div>
  13. <div class="bold padding">{{ item.author }}</div>
  14. <div class="lines-2 lines-height-15 grey-9 padding">
  15. 文章内容文章内容文章内容文章内容文章内容文章内容
  16. </div>
  17. </div>
  18. </div>
  19. <div class="flex flex-center flex-col" style="flex: 1">
  20. <img
  21. src="https://wutong-1302848345.cos.ap-chengdu.myqcloud.com/wtzx/4a721f77f9c24f55bacfe032b8060ba8.jpg"
  22. style="width: 180px; height: 180px"
  23. />
  24. <span class="mt-10 font-13"
  25. >微信扫描关注公众号<br />及时掌握更多资讯</span
  26. >
  27. </div>
  28. </div>
  29. </div>
  30. </template>
  31. <script>
  32. export default {
  33. name: 'read',
  34. data() {
  35. return {
  36. data: []
  37. }
  38. },
  39. created() {
  40. this.getList()
  41. },
  42. methods: {
  43. getList() {
  44. this.$api.dash.mpList().then(res => {
  45. if (res.code === 200) {
  46. // this.data = res.data[0].content
  47. } else {
  48. console.log(res)
  49. }
  50. })
  51. }
  52. }
  53. }
  54. </script>
  55. <style scoped></style>