vue2.5.17版本的v-for在PC浏览器显示正常，微信或者手机端浏览不显示

Question

vue2.5.17版本的v-for在PC浏览器显示正常，微信或者手机端浏览不显示，请教各位大神。

问题描述

<template>
<div>

<el-steps :active="2" finish-status="success" simple style="margin-top: 20px">
  <el-step title="投币许愿" ></el-step>
  <el-step title="邀请好友助力" description="12345"></el-step>
  <el-step title="满3人开奖" ></el-step>
</el-steps>

<!-- 卡片 -->
<el-row>

<el-col :span="8" v-for="product_list in products">
  <el-card >
      <div>{{product_list.schedule}}</div>
      <div>{{product_list.tablesA}}-{{product_list.tablesB}}桌</div>
      <div>{{product_list.storeName}}</div>
      <div>{{product_list.hallName}}</div>
      <div><font color="red">价值：{{product_list.price}}起</font></div>
      <div>1人许愿</div>
      <!-- <div>{{product_list.address}}</div> -->
      <el-button type="primary" v-on:click="jump2detail('2018年10月22日','','','','','')">立即许愿</el-button>
  </el-card>
</el-col>

</el-row>
</div>
</template>

<script>

export default {
data () {

return {
    products:[]
}

},
created: function () {
this.listProduct();
},
mounted:function(){

},

methods: {

listProduct:function(){
  var that = this;
  this.$axios.get('http://localhost:5001/v1/product/')
  .then(function (response) {
    console.log(response.data.data);
    alert(response.data.data);
    that.products = response.data.data;
  })
  .catch(function (error) {
    console.log(error);
  });
}

}
}
</script>

<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}

<!-- 跑马灯 -->
.el-carousel__item h3 {

color: #475669;
font-size: 12px;
opacity: 0.75;
line-height: 250px;
margin-bottom: auto;

}

.el-carousel__item:nth-child(2n) {

background-color: #99a9bf;

}

.el-carousel__item:nth-child(2n+1) {

background-color: #d3dce6;

}
<!-- 跑马灯 -->
<!-- 卡片 -->
.time {

font-size: 13px;
color: #999;

}

.bottom {

margin-top: 13px;
line-height: 12px;

}

.button {

padding: 0;
float: right;

}

.image {

width: 100%;
display: block;

}

.clearfix:before,
.clearfix:after {

  display: table;
  content: "";

}

.clearfix:after {

  clear: both

}
<!-- 卡片 -->
<!-- flex布局 -->
.el-row {

margin-bottom: 20px;
&:last-child {
  margin-bottom: 0;
}

}
.el-col {

border-radius: 4px;

}
.bg-purple-dark {

background: #99a9bf;

}
.bg-purple {

background: #d3dce6;

}
.bg-purple-light {

background: #e5e9f2;

}
.grid-content {

border-radius: 4px;
min-height: 36px;

}
.row-bg {

padding: 10px 0;
background-color: #f9fafc;

}
</style>

Answer 1

没效果没代码？怎么看问题？

Answer 2

先加上key试试，我看你没加上 难道没有warning吗？然后 看是样式不对还是 html都没渲染