vue读取全局配置
创建全局配置文件public/static/config.js window.config = { androidUrl:"https://Android-arm64.apk", googleplayUrl:"#", appsoreUrl:"#", windowsUrl:"#", macUrl:"#", } 在index.html中引入js <head> <script type="module" src="/static/config.js"></script> </head> 在需要的vue中可以直接使用 <script setup> import { ref } from 'vue'; let downUrls = ref(window.config) console.log(downUrls.androidUrl); </script> <div class="download-icon"> <a :href="`${downUrls.appsoreUrl}`" > <img src="../../assets/images/down_appstore.svg" alt=""> </a> <a :href="`${downUrls.googleplayUrl}`" > <img src="../../assets/images/down_googleplay.svg" alt=""> </a> <a :href="`${downUrls.androidUrl}`" > <img src="../../assets/images/down_android.svg" alt=""> </a> <a :href="`${downUrls.windowsUrl}`" > <img src="../../assets/images/down_windows.svg" alt=""> </a> <a :href="`${downUrls.macUrl}`" > <img src="../../assets/images/down_mac.svg" alt=""> </a> </div> 或 <div class="footer-right"> <ul> <li v-for="(v, i) in footerlist" :key="i"> <p>{{ v.title }}</p> <div v-for="(item, j) in v.list" :key="j" @click="clickFoot(i,j)">{{ item.label }}</div> </li> </ul> </div> export default { setup() { const footerlist = ref( }, }, methods: { scrollToElement(refID) { // this.$nextTick(() => { // const element = document.getElementById("service"); // console.log(element); // this.$refs.service.$el.scrollIntoView({ behavior: 'smooth' }); // }); let time=setTimeout(()=>{ this.$nextTick(()=>{ let top=0; let targetElement=document.getElementById(refID); if(targetElement){ // 获取元素距离顶部的距离 top=targetElement.offsetTop; } if(top>0){ // 滚动到指定位置 window.scrollTo({ top: top, behavior: 'smooth' }); } clearTimeout(time); time=null; }) },300); }, clickFoot(i,j) { let clickData = this.footerlist.list; //type,1:打开新的连接，2:跳转到页内指定位置，3:跳转网站内路由页面 switch(clickData.type){ case 1: if( clickData.data && clickData.data != "" ){ window.open(clickData.data, '_blank'); } break; case 2: this.scrollToElement(clickData.data); break; case 3: this.$router.push(clickData.data); window.scrollTo(0, 0);