vuejs3 apexcharts で以下のエラー apexcharts vuejs

vuejs3 apexcharts で以下のエラー

apiをつかって、json取得しその結果を
template 内の
<apexchart width="500" type="bar" :options="chartOptions" :series="series1"></apexchart>
に表示したところ以下のエラー

-----------------------------
Uncaught runtime errors:
×
ERROR
Cannot read properties of undefined (reading 'type')
TypeError: Cannot read properties of undefined (reading 'type')
at t.value (webpack-internal:///../node_modules/apexcharts/dist/apexcharts.common.js:5:82753)
at t.value (webpack-internal:///../node_modules/apexcharts/dist/apexcharts.common.js:5:91235)
at new t (webpack-internal:///../node_modules/apexcharts/dist/apexcharts.common.js:10:21365)
at init (webpack-internal:///../node_modules/vue3-apexcharts/dist/vue3-apexcharts.common.js:282:25)
-----------------------------

エラーメッセージから、何が原因かは全くわからなかったが
api経由でなく、return箇所に json を直で書くとエラーがでなかったため

初期化時に、nullではなくもう少し値を設定してあげるとエラーがでなくなった

const series1 = ref([]);
const chartOptions = ref(null);



const chartOptions = ref({
chart: { id: "vuechart-example", },
xaxis: { categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998], },
}) ;
const series1 = ref([ { name: "series-1", data: [], }, ]) ;

みたいにグラフ表示の初期値をもう少し設定したら エラーでなくなった