vue中注册自定义的全局js方法

Vue是一种流行的JavaScript框架，可以实现响应式和组件化的开发模式。在Vue中注册自定义全局js方法是非常常见的需求。下面是完整的攻略：

一、创建js方法

首先，我们需要创建自定义的全局js方法。例如，我们创建一个简单的方法，用于在控制台中输出一段消息：

function logMessage(message) {
  console.log(message);
}

二、在Vue中注册全局方法

Vue提供了Vue.prototype对象，可以在该对象上添加实例方法。我们可以在该对象上添加我们刚刚创建的自定义方法：

// 在Vue中注册自定义方法
Vue.prototype.$logMessage = logMessage;

现在，$logMessage方法已经被注册到Vue实例中。在任何Vue组件中，都可以使用该方法来输出消息：

Vue.component('example-component', {
  template: '<div>Example Component</div>',
  mounted() {
    this.$logMessage('Hello, world!');
  }
});

输出结果为：Hello, world!

我们还可以使用全局mixin，来为所有的组件添加新的方法，例如：

// 扩展全局Vue.mixin
Vue.mixin({
  methods: {
    $logMessage(message) {
      console.log(message);
    }
  }
});

现在，$logMessage方法已经在所有组件中注册。我们可以在任何组件中使用该方法：

Vue.component('example-component', {
  template: '<div>Example Component</div>',
  mounted() {
    this.$logMessage('Hello, world!');
  }
});

输出结果为：Hello, world!

三、代码示例

下面是两条示例说明：

示例1：在Vue中注册全局方法

<template>
  <div>
    <button @click="logSomething">打印一些内容</button>
  </div>
</template>

<script>
// 注册全局方法
Vue.prototype.$logMessage = function(message) {
  console.log(message);
};

export default {
  methods: {
    logSomething() {
      this.$logMessage('Hello, world!');
    }
  }
}
</script>

输出结果为：Hello, world!

示例2：在Vue中使用全局mixin注册方法

<template>
  <div>
    <button @click="logSomething">打印一些内容</button>
  </div>
</template>

<script>
// 注册全局mixin
Vue.mixin({
  methods: {
    $logMessage(message) {
      console.log(message);
    }
  }
});

export default {
  methods: {
    logSomething() {
      this.$logMessage('Hello, world!');
    }
  }
}
</script>

输出结果为：Hello, world!

以上是关于Vue中注册自定义全局js方法的完整攻略，包括创建方法、注册方法并提供两个示例。