vue.js 如何导出函数

ghg1uchk 于 2023-06-24 发布在 Vue.js

关注(0)|答案(2)|浏览(160)

如下面的代码所示，我想导出函数GISWSCaller。我正在学习this link中的教程，我想创建一些东西，如该链接中的第三个代码片段。我遇到的问题是，对于下面发布的代码，VS-codes工作室无法识别该代码为有效代码。我的意思是相同的代码张贴在下面时，粘贴到VS代码，它成为彩色的whitw作为shonw在所附的屏幕截图。
请让我知道如何正确地我应该出口下面张贴的代码.

更新代码.vue：

import { provide } from 'vue';
let res = undefined

export default function GISWSCaller(){

  async function fetchURL(params){
    console.log("params:",params);
    
    const splitted = params.split(',')
    if (splitted.length == 4) {
      const response = await fetch('https://xx/xx/getDistanceFromOriginToDestination/' + params)
      res =  await response.json()
      return res
    }
    return false
  }
  
const ctx = {
  fetchURL
}

provide('GISWSContext',ctx)
return fetchURL
}

img：

vue.js

来源：https://stackoverflow.com/questions/76454568/how-to-export-a-function

2条答案

按热度按时间

oxiaedzo1#

您的文件扩展名错误。应该是.js。
其次，你写的是一个组合物，而不是一个组件。所以目录应该命名为composables而不是components。

赞(0）回复(0）举报 2023-06-24

e4yzc0pl2#

在VUE JS中，组件由三个部分组成：

<template></template>

<style></style>

<script></script>

所有的代码都必须在这个部分中。你的文件是.vue格式，你的代码不在提到的部分。将代码放入脚本标记中，或者将文件扩展名更改为.js以解决此问题。
more information
编辑：
src/utils/GISWSCaller.is

let res = undefined

export function useGISWSCaller() {
    async function fetchURL(params) {
        console.log('params:', params);

        const splitted = params.split(',')
        if (splitted.length == 4) {
            const response = await fetch('https://xx/xx/getDistanceFromOriginToDestination/' + params)
            res = await response.json()
            return res
        }
        return false
    }

    const ctx = {
        fetchURL
    }

    return ctx
}

src/main.js

import {createApp} from 'vue'
import {useGISWSCaller} from 'GISWSCaller'

const app = createApp({})
const ctx = useGISWSCaller()
app.provide('ctx', ctx)
app.mount('#app');

赞(0）回复(0）举报 2023-06-24

我来回答

vue.js 如何导出函数

2条答案

相关问题

热门标签

最新问答