vue中通过js导出定义共享变量

首先创建一个js文件

devlist.js
export const dmhData = {
    dmhJzSignalsList: [],
    dmhSectorList: [],
    dmhTurnoutList: [],
}

然后在需要赋值的组件引入

one.vue

<script setup>
import {dmhData} from "../devlist";
function setData(){
	dmhData.dmhSectorList = [] //里面进行赋值
}
</script>

然后在另一个组件中获取值

two.vue

<script setup>
import {dmhData} from "../devlist";
let isChecking = true;

//这里因为我两个组件是同步操作数据的，会出现调用取值方法在赋值方法之前，所以这样去循环获取一下值。如果取值方法在赋值方法是有固定先后顺序的，则可以直接获取值
function geDevData() {
  if (dmhData.dmhSectorList.length > 0) {
    // 停止检查并开始处理数据
    isChecking = false;
    console.log(dmhData.dmhSectorList)
  } else if (isChecking) {
    // 继续检查
    setTimeout(geDevData, 100); // 每隔一秒检查一次
  }
}


onMounted(() => {
  geDevData();
})
</script>