l***@163.com
l***@163.com
  • 发布:2022-12-06 18:31
  • 更新:2022-12-06 18:31
  • 阅读:173

开发小程序使用ucharts 不报错,页面也没有数据展示

分类:uni-app

在开发微信小程序时出现以下情况,编译通过,运行到开发者工具,控制台也没有报错,运行后,页面没有图表展示,调试器显示都为0,但是也设置大小了,这是咋回事?
代码如下

<template>  
    <view>  
        总哺乳量:{{sumMuilk}} g  
        <view style="width: 100%;height: 200px;">  
            <!-- <qiun-data-charts type="column" :chartData="chartData" style="width: 100px;height: 100px;"/> -->  
             <qiun-data-charts type="column" :chartData="chartsDataColumn1" style="width: 100%;height: 100px;"/>  
        </view>  
        <uni-table ref="table" :loading="loading" border stripe  emptyText="暂无更多数据"  
            >  
            <uni-tr>  
                <uni-th width="160" align="center">日期</uni-th>  
                <uni-th width="70" align="center">泌乳量</uni-th>  
                <uni-th width="80"  align="center">类型</uni-th>  

            </uni-tr>  
            <uni-tr v-for="(item, index) in breastfeedingList" :key="index">  
                <uni-td>{{ item.createTime }}</uni-td>  
                <uni-td>  
                    <view class="milk-volune" align="center">{{ item.milkVolume }}</view>  
                </uni-td>  
                <uni-td align="center">  
                    <sapn v-if="item.milkType==1">哺乳</sapn>  
                <sapn v-if="item.milkType==2">吸奶</sapn>  
                </uni-td>  

            </uni-tr>  
        </uni-table>  
        <!-- <view class="uni-pagination-box">  
            <uni-pagination show-icon :page-size="pageSize" :current="pageCurrent" :total="total" @change="change" />  
        </view> -->  

    </view>  
</template>  

<script>  
    import {  
        selectAllListByUserId,selectSumByUserId  
    } from '@/api/lactationRecord.js'  
    import qiunDataCharts from '@/components/qiun-data-charts/components/qiun-data-charts/qiun-data-charts.vue'  
    export default {  
        comments:{  
            qiunDataCharts  
        },  
        data() {  
            return {  
                chartsDataColumn1: '',  
                loading: false,  
                userInfo:{},  
                sumMuilk: 0,  

                chartData:{  
                  categories:['2016','2017','2018','2019','2020','2021'],  
                  series:[  
                    {  
                      name:'目标值',  
                      data:[35, 36, 31, 33, 13, 34]  
                    },  
                    {  
                      name:'完成量',  
                      data:[18, 27, 21, 24, 6, 28]  
                    }  
                  ]  
                },  
                breastfeedingList:[],  
            }  
        },  
        onLoad() {  
            this.userInfo = uni.getStorageSync("userInfo")  
            this.getAllList()  
            this.getSumMilk()  
            this.chartsDataColumn1 ={  

                        categories: ["2016", "2017", "2018", "2019", "2020", "2021"],  
                        series: [  
                          {  
                            name: "目标值",  
                            data: [35, 36, 31, 33, 13, 34],  
                          },  
                          {  
                            name: "完成量",  
                            data: [18, 27, 21, 24, 6, 28],  
                          },  
                        ],  

            }  
        },  
        methods: {  
            getAllList() {  

                let list = {  
                    userId: this.userInfo.id  
                }  
                selectAllListByUserId(list).then((res) => {  
                    console.log(res)  
                    this.breastfeedingList = res.data  
                }).catch(err => {  
                    //失败结果  
                    console.log(err)  
                });  
            },  
            getSumMilk(){  
                let list = {  
                    userId: this.userInfo.id  
                }  
                selectSumByUserId(list).then((res) => {  
                    console.log(res)  
                    this.sumMuilk = res.data  
                    //this.breastfeedingList = res.data  
                }).catch(err => {  
                    //失败结果  
                    console.log(err)  
                });  
            }  
        }  
    }  
</script>  

<style>  
    .milk-volune{  
        text-align: center;  
    }  
</style>  

目录结构如下:

运行到开发者工具如下


控制台中也没有出现错误,

2022-12-06 18:31 负责人:无 分享
已邀请:

要回复问题请先登录注册