码迷,mamicode.com
首页 > 编程语言 > 详细

Vue-切割json数组字符串并循环输出

时间:2018-01-06 12:00:23      阅读:1476      评论:0      收藏:0      [点我收藏+]

标签:for   .sh   epo   eal   exp   panel   temp   nbsp   inf   

Json

        "detailList":[  
                  " 04/08/2016 - LA - -  Dept. - TITLE (Lien Reported)",
                  " 04/05/2016 - KA - - Motor Dept. - REGISTRATION RENEWAL (Lease) ",
                  " 03/20/2016 - SA - 30 - Motor Dept. - ODOMETER",
                  " 03/16/2016 - - - Source - DEALER "
               ]

*.vue

<template>
<div class="tab-pane" id="historyReport">
                        <p class="ptb16 plr30 bgc-0d7dce fs16 c-fff">History Report</p>
                        <div class="panel-group vehicleHistory">
                            <div class="ptb16 plr20" v-for="e in strs">
                                <div class="mb12 df jc-sb">
                                    <span class="fs16">{{e.split(‘-‘)[3]}}</span><span class="fs12 lh24 c-c4c4c4">{{e.split(‘-‘)[0]}}</span>
                                </div>
                                <p class="fs12">Location:<span>{{e.split(‘-‘)[1]}}</span></p>
                                <p class="fs12">Mileage Record:<span>{{e.split(‘-‘)[2]}}</span>Miles</p>
                                <p class="fs12"><span>{{e.split(‘-‘)[4]}}</span></p>
                                
                            </div>
                                
                        </div>
                    </div>
</template>

<script>
export default {
  data () {
      strs: []
    }
  },
  created: function () {
    this.getCarReport()
  },
  methods: {
    getCarReport () {
      return this.$http.get(‘/***/****/‘ + this.id + ‘.json‘)
      .then((response) => {
        this.shareCarInfo = response.data.data
        this.strs = this.shareCarInfo.****.****.detailList
       })
    }
  }
}
</script>

 

Vue-切割json数组字符串并循环输出

标签:for   .sh   epo   eal   exp   panel   temp   nbsp   inf   

原文地址:https://www.cnblogs.com/Harold-Hua/p/8213342.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!