the vue2.5.17 version of v-for displays normally in PC browsers, but not in Wechat or mobile browsing. Please consult the gods.
problem description
< template >
<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("20181022","","","","","")"></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:-sharp42b983;
}
.el-carousel__item h3 {
color: -sharp475669;
font-size: 12px;
opacity: 0.75;
line-height: 250px;
margin-bottom: auto;}
.el-carousel__item:nth-child (2n) {
background-color: -sharp99a9bf;}
.el-carousel__item:nth-child (2n+1) {
background-color: -sharpd3dce6;}
.time {
font-size: 13px;
color: -sharp999;}
.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}
.el-row {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}}
.el-col {
border-radius: 4px;}
.bg-purple-dark {
background: -sharp99a9bf;}
.bg-purple {
background: -sharpd3dce6;}
.bg-purple-light {
background: -sharpe5e9f2;}
.grid-content {
border-radius: 4px;
min-height: 36px;}
.row-bg {
padding: 10px 0;
background-color: -sharpf9fafc;}
< / style >