Javascript 操作外部js文件中的Vue数据

Javascript 操作外部js文件中的Vue数据,javascript,vue.js,Javascript,Vue.js,我正在从外部js文件导出一个函数,并试图以这种方式操作Vue数据bu,但目前我无法做到这一点。以下是我迄今为止所做的尝试: 导入的js文件如下所示: import * as device from "../Device"; device.playURL(this.currentTVChannelUrl,this.loading,this.isPlayerShown); 调用如下方法: import * as device from "../Device"; device.playURL

我正在从外部js文件导出一个函数,并试图以这种方式操作Vue数据bu,但目前我无法做到这一点。以下是我迄今为止所做的尝试:

导入的js文件如下所示:

import * as device from "../Device"; 
device.playURL(this.currentTVChannelUrl,this.loading,this.isPlayerShown);
调用如下方法:

import * as device from "../Device"; 
device.playURL(this.currentTVChannelUrl,this.loading,this.isPlayerShown);
以下是device.js文件中名为playURL的方法:

export function playURL(url,loading,isPlayerShown){
    player.play({
      uri: url,
    });
      loading = false;
      isPlayerShown = true;
}

它不会更改我的Vue组件的操作数据。有办法更改它们吗?

您可以将playURL的此上下文绑定到当前组件并使其正常工作

let bindedplayURL = device.playURL.bind(this);
bindedplayURL(this.currentTVChannelUrl)
playURL(url) {
  player.play({
    uri: url,
  });
  this.loading = false /* changes data in vue component directly no need to pass these varibles separately */
  this.isPlayerShown = true;
}

但是,如果您创建playURL函数是为了在Vue文件中的不同位置使用它。我甚至建议您查看vue中的mixin,它只解决这个问题,而且它们会智能地混合数据和方法本身。

您可以在
vue根目录中添加
playURL
,实例
events
dispatch
您的子组件