Question

我在vue app方法中有两个不同的功能，它们的某些代码受到限制，无法合并。但同时我需要在函数f1中使用一些变量才能在函数f2中使用。

<script>
let item1;
export default {
  data(): return{},
  methods: {
    function f1(){
      const item1 = value1;
    },
    function f2(){
      const item2 = item1;
      console.log(item2);
    }
  },
  mounted: {
    this.f1();
    this.f2();
  }
}

这是示例代码，我需要{2}读取item1值。 item1的值只能从函数f1中检索，而函数f2需要该值。有什么可以使变量成为全局变量的吗？

Answer 1

在数据上定义您的变量“ item1”，并在任何功能中使用它，请参见此示例

<script>
 export default {
data() {
    return {
        item1: ''
    };
},
methods: {
    f1() {
         this.item1 = value1;
    },
    f2() {
        const item2 = this.item1;
        console.log(item2);
    }
  }
 };
</script>

Answer 2

您需要执行以下操作

// Global Scope you can access these items
let item1;
let item2;

function one() {
  // function scope can access items on the global scope
  // but anything defined within here will not be accessible by the global scope
  item1 = 'item1';
}

function two() {
  // function scope
  item2 = item1;
  console.log(item2);
}

one();
two();

您的示例不起作用的原因是由于scope。

您的vue.js文件应如下所示

<script>
export default {
  data() {
    return {
      item1: null,
      item2: null
    }
  },
  methods: {
    f1() {
      this.item1 = 'item1';
    },
    f2() {
      this.item2 = this.item1;
    }
  },
  mounted() {
    this.f1();
    this.f2();
  }
}
</script>

Answer 3

let item1;

function f1() {
  item1 = "value1";
}

function f2() {
  const item2 = item1;
  console.log(item2);
}
f1();
f2();

您必须声明一个全局变量才能在不同的函数中使用它。

Answer 4

此代码运行良好，我通过使用第一个函数将第二个函数激活。

export default {
  data(): return{},
  methods: {
    f1(){
      const item1 = value1;
      this.f2(item1)
    },
    f2(item1){
      const item2 = item1;
      console.log(item2);
    }
  },
  mounted: {
    this.f1();
  }
}

Answer 5

这实际上是我面临的相同问题。

然后我发现vue中的标签与html中的标签几乎相同。您始终可以编写自己的js代码，然后选择要默认导出的部分，即确切的组件定义。

因此，您可以轻松地执行此操作以访问来自不同方法，监视，计算甚至数据的变量。

<template>
    <div>abc</div>
</template>
<script>
let item1

export default {
    data(): return{},
    methods: {
        function f1(){
            item1 = value1;
        },
        function f2(){
            const item2 = item1;
            console.log(item2);
        }
    },
    mounted: {
        this.f1();
        this.f2();
    }
}
</script>

只是避免使用const来声明另一个仅在该方法中可用的局部变量item1。您会没事的。

如何在不同的函数中传递变量

5 个答案: