echarts不显示不报错

在VUE后台管理项目中使用echarts出现了不报错误也不显示图例(设置的宽和ref),总共三个图,只显示第一个图。 下面是部分代码,求指教。
三个图标的HTML

<el-card style="height: 280px;">
    <div style="height: 280px;" ref="echars"></div>
<!-- ref用来后期获取当前的DOM节点 -->
</el-card>
<div class="graph">
<el-card style="height: 265px;">
<div style="height: 245px;" ref="userEcharts"></div>
</el-card>
<el-card style="height: 265px;">
<div style="height: 245px;" ref="videoEcharts"></div>
</el-card>
</div>

以下是JS部分(第二个柱状图不显示)

                    //用户图
                    const userOption = {
                        user: {
                            legend: {
                                // 图例文字颜色
                                textStyle: {
                                color: "#333",
                                }
                            },
                            grid: {
                                left: "20%",
                            },
                            // 提示框
                            tooltip: {
                                trigger: "axis",
                            },
                            xAxis: {
                                type: "category", // 类目轴
                                data: data.userData.map(item => item.date),
                                axisLine: {
                                lineStyle: {
                                    color: "#17b3a3",
                                },
                                },
                                axisLabel: {
                                interval: 0,
                                color: "#333",
                                },
                            },
                            yAxis: [
                                {
                                type: "value",
                                axisLine: {
                                    lineStyle: {
                                    color: "#17b3a3",
                                    },
                                },
                            },
                        ],
                        color: ["#2ec7c9", "#b6a2de"],
                        series: [
                            {
                                name:'新增用户',
                                data: data.userData.map(item => item.new),
                                type:'bar'
                            },
                            {
                                name:'活跃用户',
                                data: data.userData.map(item => item.active),
                                type:'bar'
                            }
                        ],
                    },
                    }
                    const U = echars.init(this.$refs.userEcharts)
                    U.setOption(userOption)

(饼图不显示)

const videoOption = {
                        video: {
                            tooltip: {
                                trigger: "item",
                            },
                            color: [
                                "#0f78f4",
                                "#dd536b",
                                "#9462e5",
                                "#a6a6a6",
                                "#e1bb22",
                                "#39c362",
                                "#3ed1cf",
                            ],
                            series: [],
                        },
                        series:[
                            {
                                data:data.videoData,
                                type:'pie'
                            }
                        ],
                    }
                    const V = echars.init(this.$refs.videoEcharts)
                    V.getOption(videoOption)

img

之前简单写过一遍文章 Vue中使用echarts案例,你看下 https://blog.csdn.net/hl_qianduan/article/details/118656649

已经解决了,非常感谢。
原因是因为 我在定义的userOption、videoOption 中添加了对象 user{} 和video{} 对象 ,没有引用对象,将这两个对象删除后,所有正常引用 。。。 在饼图中将set打成get echarts 拼写错误,这些都是要注意的点。