templateC.vue 1.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364
  1. <template>
  2. <scroll-view scroll-x="true" class="picture">
  3. <view class="section" v-for="(item , index) in productList" @click="navigaitionTo(item)">
  4. <image :src="item.adsImage" mode="heightFix"></image>
  5. </view>
  6. </scroll-view>
  7. </template>
  8. <script>
  9. export default{
  10. data(){
  11. return{
  12. productList:[]
  13. }
  14. },
  15. props:{
  16. pageData: {
  17. type: Object
  18. },
  19. userIdentity: {
  20. type: Number
  21. }
  22. },
  23. created() {
  24. this.initData(this.pageData);
  25. },
  26. methods:{
  27. initData(data){
  28. this.productList = data.floorImageList;
  29. },
  30. navigaitionTo(item){
  31. console.log(item);
  32. if(item.link){
  33. uni.navigateTo({
  34. url:`/h5/pages/article/path?link=${item.link}`
  35. })
  36. }
  37. }
  38. }
  39. }
  40. </script>
  41. <style lang="scss">
  42. .picture{
  43. width: 750rpx;
  44. margin-left: -24rpx;
  45. white-space: nowrap;
  46. .section{
  47. display: inline-block;
  48. margin-right: 24rpx;
  49. width: 310rpx;
  50. height: 240rpx;
  51. overflow: hidden;
  52. border-radius: 16rpx;
  53. image{
  54. width: 310rpx;
  55. height: 240rpx;
  56. }
  57. &:first-child{
  58. margin-left: 24rpx;
  59. }
  60. }
  61. }
  62. </style>