在Vue之外使用函数，将数据传递到Vue中

Question

我有一个在vue组件外部运行的函数，我想把它返回的数据传递给vue组件中的数据。

    <script>
      function example(){
        var item = 'item';
      };

      example();

      export default {
        data(){
          return (this is where I want item represented)
        }
      }

- Josh Winters

Answer 1

查看演示：

var app = new Vue({
  el: '#app',
  data: {
    item: "Hi"
  }
});


function example(){
      app.item='Hello How R You ?';
};

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js"></script>

<div id="app">
<button onclick="example()" >Click ME</button>
  {{ item }}
</div>

- Saurabh Mistry

---

为什么这不是被接受的答案？它是最简单和最容易的方法。 - Malekai

Answer 2

将该函数分配给一个const，并在其中一个组件生命周期钩子中调用它：

const example = function (){
    return 'item';
};

export default {
    created () {
        this.item = example()
    },
    data(){
      return {
         item: null
      }
    }
  }

- user320487